diff --git a/README.md b/README.md index eef4c65..5418f91 100644 --- a/README.md +++ b/README.md @@ -5,6 +5,10 @@ [![Docs](https://github.com/sawfwair/dkcli/actions/workflows/docs.yml/badge.svg)](https://github.com/sawfwair/dkcli/actions/workflows/docs.yml) [![npm](https://img.shields.io/npm/v/%40dkcli%2Fcli?color=%23af6100)](https://www.npmjs.com/package/@dkcli/cli) +

+ DesignKit CLI turns a seed color into palette, type, motion, layout, and proof outputs. +

+ Proof-driven design tooling for teams that want interface decisions to leave evidence behind. DesignKit ships a deterministic CLI and package workspace for OKLCH palettes, APCA contrast, fluid scales, motion curves, optical corrections, layout rails, composition scoring, typography recommendations, CSS audits, token emission, and Svelte 5 component recipes. @@ -47,6 +51,10 @@ dk text --font 18 --measure 680 --contrast 72 dk audit --css app.css ``` +

+ A generated DesignKit proof snapshot with palette swatches, APCA passes, layout metrics, and motion output. +

+ ## Packages - `@dkcli/cli`: the `dk` and `dkcli` command line tools. @@ -64,6 +72,10 @@ dk audit --css app.css | Layout | `layout`, `compose`, `saliency`, `future` | Solve rails, score composition, and explore content topology. | | Product | `components`, `cms` | Verify component recipes and manage hosted DKCMS content. | +

+ DesignKit command families flowing into CLI, core, tokens, and components packages. +

+ ## Local Development Use Node 22 or newer and pnpm 10.33.0. diff --git a/docs/public/readme-hero.svg b/docs/public/readme-hero.svg new file mode 100644 index 0000000..c86881e --- /dev/null +++ b/docs/public/readme-hero.svg @@ -0,0 +1,77 @@ + + DesignKit CLI hero graphic + A dark editorial graphic showing the dk command line turning a seed color into palette, type, motion, layout, and proof outputs. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + DKCLI + Design tokens + with proof. + Run one command. Keep the proof. + + + + + + + + + dk perfect + + $ dk perfect --seed "#D96F32" --ratio perfect-fourth + palette + OKLCH, APCA, CVD distinctness + layout + 12 rails, no overlap, scored composition + proof + PASS Lc 98.3 / 77.2 / 73.2 + + + + + Generated proof + #D96F32 seed, light mode + + + + Body on surface + Lc 98.3 PASS + + + + Primary action + Lc 77.2 PASS + + + + Signal accent + Lc 73.2 PASS + + + + diff --git a/docs/public/readme-map.svg b/docs/public/readme-map.svg new file mode 100644 index 0000000..762f143 --- /dev/null +++ b/docs/public/readme-map.svg @@ -0,0 +1,66 @@ + + DesignKit CLI command and package map + A diagram mapping dk commands through proof, foundations, motion, layout, and product command families into the cli, core, tokens, and components packages. + + + + + + + + + + Command families and package flow + DesignKit keeps heavy proof math in deterministic packages and emits artifacts consumers can ship. + + + + dk command + dk perfect + dk palette --json + + + + + + + Proof + + + Foundations + + + Motion + + + Layout + + + Product + + + Audit + + + + + + + Artifacts + theme.css + proof.json + tokens + recipes + + + + + @dkcli/cli + + @dkcli/core + + @dkcli/tokens + + @dkcli/components + + diff --git a/docs/public/readme-proof.svg b/docs/public/readme-proof.svg new file mode 100644 index 0000000..94f1cee --- /dev/null +++ b/docs/public/readme-proof.svg @@ -0,0 +1,74 @@ + + DesignKit generated proof snapshot + A proof snapshot showing generated colors, APCA contrast passes, layout metrics, and motion output for the DesignKit CLI default seed. + + + + + + + + + + Proof snapshot from dk perfect + Seed #D96F32 resolves into inspectable colors, contrast checks, motion, layout, and token output. + + + + Palette + + + + + + + seed + main + a11y + info + ink + + + + + + APCA contrast + + + Body on surface Lc 98.3 PASS + + Primary action Lc 77.2 PASS + + Signal accent Lc 73.2 PASS + + + + + + Layout rail + 573px frame + + + + + + + + + + + + gap 14 / padding 23 / overflow 0 / composition 68 + + + + + Outputs + CSS tokens + JSON proof + Svelte recipes + audit gates + + + snappy motion curve +