SolarWind CSS ☉≈

Design tokens for Vicinage & StyleX.

Install

npm install solarwindcss

Usage

import { apply } from 'vicinage'
import { font } from 'solarwindcss'
import { color } from 'solarwindcss/color.stylex'

function Example() {
  return (
    <div
      {...apply(
        font.mono,
        {
          color: color.green500,
          backgroundColor: 'black',
        },
        //
      )}
    >
      hello, world
    </div>
  )
}

API

• Responsive Design
• Colors
• Spacing

Layout

• aspectRatio
• display

Sizing

• width

Typography

• fontFamily
• fontSize
• fontSmoothing
• fontWeight
• letterSpacing
• lineClamp
• lineHeight
• textOverflow

Borders

• borderRadius
• outline

Effects & Filters

• boxShadow
• textShadow
• filter

Transforms

• perspective

Transitions & Animation

• transition
• animation