Webflags: g

CSS Custom Property (Variable)

Match CSS custom properties (variables) like `--brand-color` or `--font-size-lg`.

Try it in RegexPro →

Available in

JSSupported

JavaScript / ECMAScript

Browser-native RegExp. Default if you don't pick.

PYSupported

Python (re)

CPython stdlib `re`. Unicode-aware `\w` and `\d` by default.

GOSupported

Go (RE2)

Linear-time matching. No backreferences or lookarounds.

Pattern

regexengine-agnostic
--[a-zA-Z][a-zA-Z0-9\-]*   (flags: g)

Raw source: --[a-zA-Z][a-zA-Z0-9\-]*

How it works

-- is the literal double-dash that prefixes every CSS custom property. [a-zA-Z] requires the next character to be a letter (digits and hyphens are allowed elsewhere but not in lead position by convention). [a-zA-Z0-9\-]* allows the rest of the name: any combination of letters, digits, and hyphens.

Examples

Input

:root { --brand-color: #10b981; --space-4: 1rem; }

Matches

  • --brand-color
  • --space-4

Input

var(--text-primary, #fff)

Matches

  • --text-primary

Input

.foo { color: red; }

No match

—

Common use cases

  • •Design-token extraction from CSS files
  • •Theme migration tooling
  • •Dead-CSS-variable detection
  • •Documentation generation for design systems
←PreviousVideo File Extension
All patterns
NextSSH Public Key→