Quickstart

Get running in three steps.

Install. Configure. Build. The full reference lives in one markdown file at /llms.txt.

Step 1

Install

npm install eva-css-fluid \
            eva-css-purge \
            eva-colors

Three packages: the framework, the CSS purger, and the OKLCH color utilities.

Step 2

Configure

// styles/main.scss
@use 'eva-css-fluid' with (
  $sizes: (4, 8, 16, 32, 64, 128),
  $font-sizes: (14, 16, 24, 36, 52),
  $build-class: true
);

Just the sizes you actually use. Modifiers ( _, __, -) are generated automatically.

Step 3

Build

npx sass \
  --load-path=node_modules \
  styles/main.scss:styles/main.css

Native Sass works directly. Or use the watch script: npm run watch.

CLI commands

Two CLIs ship alongside the framework: color conversion and CSS purging.

eva-color

npx eva-color convert "#ff0000"
npx eva-color palette "#ff0000" 7
npx eva-color theme my.json
npx eva-color contrast "#fff" "#000"

HEX-OKLCH conversion and theme generation.

eva-purge

npx eva-purge \
  --css styles/main.css \
  --content '**/*.html' \
  --output styles/min.css

40-70 % CSS reduction on production builds.

Adopting EVA in your project

From greenfield to retrofit — one guide.

Wire EVA into a fresh, mid-stage, or fully-shipped project. The guide walks through entry points, the px audit + fusion workflow, design-token aliasing, multi-themes, and dark mode via .toggle-theme. The LLM version is dense and pasteable into Claude, ChatGPT, or Cursor.

Read use-eva.md → Open use-eva-llm.md →

The full reference

All variables, all formulas, all examples — in /llms.txt.

Don't read documentation. Paste it. Copy /llms.txt into Claude, ChatGPT, or Cursor — your AI now knows EVA CSS by heart and can write it for you.

Open /llms.txt → Open /llms-full.txt →