What origin classification is #
When Loupely Lens captures the CSS Cascade for an element, it doesn’t just record which rule is currently winning. It records where every rule came from. Origin classification is the process of identifying the source of each CSS rule in the captured stack. This is what makes a Lens diagnosis specific rather than vague: “your theme is overriding your Page Builder” is only possible because Lens knows which rule came from the theme and which came from the Page Builder.
The origin categories #
Lens classifies CSS rules into 12 origin categories. The most commonly encountered ones are:
Theme stylesheet. Rules from the active WordPress theme’s main CSS file or child theme. These rules form the baseline visual design of the site. They load early and have moderate specificity, but they’re often deeply nested selectors that are hard to override without understanding the theme’s class structure.
Page Builder. Rules injected by Page Builder plugins like Elementor, Divi, or Beaver Builder, either as generated stylesheets or as inline styles. Page builders often inject highly specific selectors or inline styles that override theme rules. When a setting in your Page Builder appears to have no effect, a more specific rule from the theme is often winning.
Plugin. Rules from installed plugins, typically loaded as separate stylesheets. A contact form plugin, a slider plugin, or a WooCommerce extension each add their own CSS to the page. Plugin CSS conflicts happen when two plugins both try to style the same element in incompatible ways.
Inline Style. Styles applied directly to the HTML element as a style attribute, typically injected by JavaScript at page load. Inline styles override nearly all stylesheet rules regardless of specificity. They can only be overridden by !important declarations.
Browser default. The baseline styles every browser applies to HTML elements before any stylesheets load. Buttons, links, headings, and form elements all have browser defaults that theme stylesheets usually reset.
Why origin classification changes the diagnosis #
Without knowing origins, all a diagnostic tool can say is “rule A is winning over rule B.” With origin classification, Lens can say “an Inline Style injected by your Page Builder’s JavaScript is winning over your theme’s stylesheet rule, and the Inline Style can only be overridden with !important.” That diagnosis points directly to a specific fix. The triage step changes entirely depending on which origins are in conflict.