Function css

Generate optimized CSS from template literals with intelligent value interpolation and whitespace normalization.

Value Handling:

  • Primitives: Direct string conversion
  • Arrays: Space-separated flattening (recursive)
  • Objects: CSS key-value pairs with camelCase→kebab-case conversion
  • Filters null/undefined values

Outputs single-line minified CSS via high-performance regex normalization. Scales excellently - processes large CSS bundles (300KB+) in milliseconds.

Example

css`.button { color: ${['red', 'bold']}; margin: ${[10, 20]}px; }`;
// Returns: ".button{ color:red bold; margin:10 20px; }"

css`.theme { ${({ backgroundColor: '#007bff', fontSize: '16px' })} }`;
// Returns: ".theme{ background-color:#007bff; font-size:16px; }"
  • css(strings, ...values): string

  • Parameters

    • strings: TemplateStringsArray

      Template literal static parts

    • Rest...values: any[]

      Dynamic values (primitives, arrays, objects)

    Returns string

    Minified CSS string

Settings

Member Visibility