Search for tools...
⌘K
Tools
Pricing
More
Sign in
Back to tools
CSS Variable Extractor
Paste any CSS to extract all custom properties, grouped by scope with type detection.
CSS Input
Clear
:root { --color-primary: #FF4E3A; --color-secondary: #3a8bff; --color-background: #ffffff; --color-text: #0f0f0f; --color-muted: rgba(0, 0, 0, 0.4); --color-border: hsl(0, 0%, 91%); --spacing-xs: 4px; --spacing-sm: 8px; --spacing-md: 16px; --spacing-lg: 32px; --spacing-xl: 64px; --radius-sm: 0.375rem; --radius-md: 0.75rem; --radius-lg: 1rem; --font-size-base: 1rem; --font-size-sm: 0.875rem; --font-weight-bold: 700; --opacity-disabled: 0.4; --z-modal: 1000; --transition-fast: 150ms ease; } .dark { --color-background: #0a0a0a; --color-text: #f0f0f0; --color-border: hsl(0, 0%, 15%); --color-muted: rgba(255, 255, 255, 0.4); } @media (max-width: 768px) { :root { --spacing-lg: 24px; --font-size-base: 0.9375rem; } }