Web Content & Formats
What is CSS?
Cascading Style Sheets, the language browsers use to style HTML: colors, typography, layout, animation, and responsive behavior.
Also known as: Cascading Style Sheets
CSS pairs selectors (.button, nav > a, body[data-theme="dark"]) with declarations (color: #2563eb; padding: 8px 16px;). The cascade decides which rule wins when several apply: specificity, source order, and !important all factor in. Layout primitives like Flexbox and Grid replaced the float-and-clear hacks that dominated CSS for a decade.
Modern CSS includes custom properties (CSS variables: --primary: #2563eb;), container queries (style based on parent size, not viewport), :has() (parent-selector logic), nesting, color functions (oklch, color-mix), and animations that no longer need JavaScript. Most of these features ship in evergreen browsers without polyfills now.
For brand intelligence, CSS is a goldmine. Inline <style> tags and linked stylesheets carry the actual color palette a site uses, often expressed as variables that are easy to recover. Font stacks reveal which web fonts the brand has chosen. Extracting these is one of the cleanest ways to recover a styleguide from a public site.
In the wild
- →Reading
:root { --color-primary: #635bff; }from a site's CSS to recover its primary brand color - →A design audit pulling every unique color value declared across a stylesheet to spot drift
- →A responsive layout that switches from a single column to a three-column grid using a container query
How Brand.dev uses css
Endpoints in the Brand.dev API where this concept comes up directly.
FAQ
What is the cascade?
CSS's rule for resolving conflicts. Roughly: the more specific selector wins; ties go to the later rule; !important overrides everything (and almost always indicates a smell).
How do CSS variables differ from preprocessor variables (Sass)?
CSS variables are live in the browser, can be changed at runtime via JS or media queries, and respect the cascade. Sass variables are compile-time only and disappear from the final output.
Can I extract a brand's color palette from its CSS?
Yes, often easily. Look for CSS variables in :root, hex/rgb/oklch values in compiled stylesheets, and Tailwind-style utility classes that reference theme tokens. Brand.dev's color extraction is essentially this, automated.
Related terms
HyperText Markup Language, the markup standard that defines the structure and semantics of every web page.
A pattern that identifies elements in an HTML document by tag, class, id, attribute, or position, used by stylesheets and (heavily) by web scrapers.
The craft of arranging type (choosing typefaces, weights, sizes, and spacing) to give written language its visual personality.
The primary visual mark a company uses to identify itself, typically a wordmark, symbol, or combination, optimized to be recognizable at any size.