llms.txt git:20260727.291875eA

Immutable. This exact content never changes and is served at /api/v1/blob/c1f65ae8de333125.

# sprezzature

> Nine Claude / OpenCode skills for vanilla JavaScript + Tailwind CSS + Roboto frontends. Released under the BSD-3-Clause license (same as scikit-learn). For solo developers and small teams shipping internal tools without a designer.

This repository is a **bundle of nine [Anthropic skills](https://resources.anthropic.com/hubfs/The-Complete-Guide-to-Building-Skill-for-Claude.pdf)**. Use them from **Claude Code** (`cp -r front-* ~/.claude/skills/`) or from **OpenCode** (`cp -r front-* ~/.opencode/skills/`). Each skill auto-triggers on its frontmatter description.

## Skill entry points

- [sprezzature-ui/SKILL.md](sprezzature-ui/SKILL.md): UI generation core — components, pages, dataviz, design system, dark mode. Always install.
- [sprezzature-cli-gui/SKILL.md](sprezzature-cli-gui/SKILL.md): Wrap an existing CLI in a single-page vanilla-JS + Tailwind GUI. Flagship.
- [sprezzature-publish/SKILL.md](sprezzature-publish/SKILL.md): Markdown → website, meta tags, favicons, site indexes, plain language.
- [sprezzature-accessibility/SKILL.md](sprezzature-accessibility/SKILL.md): a11y lint, contrast audit, CVD simulation, alt text, captions.
- [sprezzature-ux-laws/SKILL.md](sprezzature-ux-laws/SKILL.md): Apply the canonical Laws of UX (Jon Yablonski, lawsofux.com) — 30-law reference for make-time decisions plus a stdlib-only static auditor (Hick, Miller, Fitts, Jakob, Tesler, Aesthetic-Usability, Selective Attention, Doherty, Choice Overload).
- [TRIGGERS.md](TRIGGERS.md): Generated reference — every guaranteed trigger phrase mapped to the skill it activates and that skill's status. Source of truth is each SKILL.md description; regenerated by `scripts/build_triggers.py`. A pre-commit drift hook (`sprezzature-triggers-sync`) refuses any commit where the projection has drifted.

## Repo philosophy — make / audit duality

Every shipped skill carries a "Two modes — make and audit" section in its SKILL.md. The repo's README.md and LISEZMOI.md hold a full per-skill matrix; the tests in `tests/test_two_modes_discipline.py` enforce it on every commit.

## sprezzature-ui core references

- [color-psychology.md](sprezzature-ui/references/color-psychology.md): Curated palettes (Choice / Emotion / Concept / Psychology) and the semantic-color mapping.
- [stack-vanilla-js.md](sprezzature-ui/references/stack-vanilla-js.md): Vanilla JS patterns — ES modules, native `<dialog>`, events, state, i18n.
- [stack-tailwind.md](sprezzature-ui/references/stack-tailwind.md): Tailwind config, base CSS, plugins, dark-mode strategy, Inter swap.
- [checklist.md](sprezzature-ui/references/checklist.md): Pre-ship quality gate.

## sprezzature-ui charts and dataviz

- [charts-vega.md](sprezzature-ui/references/charts-vega.md): Vega-Lite house style.
- [dataviz-chart-selection.md](sprezzature-ui/references/dataviz-chart-selection.md): Decision tree for picking the right chart shape.
- [dataviz-color-palettes.md](sprezzature-ui/references/dataviz-color-palettes.md): Sequential / divergent / categorical palettes.
- [dataviz-maps.md](sprezzature-ui/references/dataviz-maps.md): Map-specific ergonomics.
- [dashboard-ergonomics.md](sprezzature-ui/references/dashboard-ergonomics.md): Tile-by-tile dashboard layout.

## sprezzature-ui design system

- [ui-guidelines/INDEX.md](sprezzature-ui/references/ui-guidelines/INDEX.md): Full map (foundations, patterns, components, inputs, platforms). Apple HIG-derived.
- [material-design.md](sprezzature-ui/references/material-design.md): Material 3 distilled with Material → skill-token mapping.
- [anti-patterns.md](sprezzature-ui/references/anti-patterns.md): Visual and copy tells to refuse.
- [ux-psychology.md](sprezzature-ui/references/ux-psychology.md): Applied cognitive principles.
- [ergonomics-criteria.md](sprezzature-ui/references/ergonomics-criteria.md): Eight ergonomic criteria for UX audit.

## sprezzature-publish — HTML, meta, i18n, indexes

- [meta-tags.md](sprezzature-publish/references/meta-tags.md): `<meta>` tags — W3C / WHATWG + Open Graph + Twitter Cards + Schema.org JSON-LD.
- [site-indexes.md](sprezzature-publish/references/site-indexes.md): robots.txt + sitemap.xml + llms.txt + Atom/RSS + humans.txt.
- [plain-language.md](sprezzature-publish/references/plain-language.md): Copy rewriting at a target grade.
- [i18n.md](sprezzature-publish/references/i18n.md): Multilingual frontend — URL strategy, `Intl.*`, plurals, RTL. Language pair configurable.

## sprezzature-accessibility — accessibility audits and content

- [lint-a11y.md](sprezzature-accessibility/references/lint-a11y.md): 14-rule static a11y lint. Honest framing — pre-commit gate, not a replacement for axe-core.
- [contrast-audit.md](sprezzature-accessibility/references/contrast-audit.md): WCAG ratio audit + OKLCH-neighbour fix hint.
- [cvd-simulation.md](sprezzature-accessibility/references/cvd-simulation.md): Protanopia / deuteranopia / tritanopia rendering.
- [alt-text-ai.md](sprezzature-accessibility/references/alt-text-ai.md): W3C-compliant alt text via local Ollama + Gemma vision.
- [captions-ai.md](sprezzature-accessibility/references/captions-ai.md): WebVTT / SRT captions via local pywhispercpp.

## sprezzature-ux-laws — Laws of UX (make + audit)

- [laws-of-ux.md](sprezzature-ux-laws/references/laws-of-ux.md): The canonical Yablonski set (30 laws) restated as trigger → action → Tailwind hook. Make-time playbook + audit-time refusal list. Sources verified by recursive crawl of lawsofux.com plus NN/g (Aesthetic-Usability) and the Wikipedia Robustness Principle critique (Postel's Law).

## Scripts (Python, cross-platform)

- [sprezzature-ui/scripts/validate.py](sprezzature-ui/scripts/validate.py): Pre-ship quality gate. Stdlib only.
- [sprezzature-publish/scripts/favicons.py](sprezzature-publish/scripts/favicons.py): Favicon / PWA / Apple-touch / maskable icon set + manifest + head snippet.
- [sprezzature-publish/scripts/meta_from_ollama.py](sprezzature-publish/scripts/meta_from_ollama.py): Drafts page meta tags from a goal or HTML page.
- [sprezzature-publish/scripts/site_indexes.py](sprezzature-publish/scripts/site_indexes.py): robots, sitemap, llms.txt, feed, humans.
- [sprezzature-publish/scripts/plain_language.py](sprezzature-publish/scripts/plain_language.py): Rewrites UI copy at a target reading grade.
- [sprezzature-accessibility/scripts/lint_a11y.py](sprezzature-accessibility/scripts/lint_a11y.py): 14-rule static a11y lint.
- [sprezzature-colors/scripts/audit_contrast.py](sprezzature-colors/scripts/audit_contrast.py): WCAG contrast audit + OKLCH fix suggester.
- [sprezzature-colors/scripts/simulate_cvd.py](sprezzature-colors/scripts/simulate_cvd.py): CVD image transforms.
- [sprezzature-colors/scripts/_colors.py](sprezzature-colors/scripts/_colors.py): Shared color primitives (sRGB, WCAG, OKLab/OKLCH, CVD matrices, palette accessors, perceptual lighten/darken).
- [sprezzature-colors/references/palette.csv](sprezzature-colors/references/palette.csv): Curated palette — one row per color, semantic projections (Base / Emotion / Concepts / Psychology±) as columns.
- [sprezzature-vision/scripts/alt_from_ollama.py](sprezzature-vision/scripts/alt_from_ollama.py): W3C alt text via local Ollama vision (`qwen3-vl:8b`).
- [sprezzature-vision/scripts/install_alt_ai.py](sprezzature-vision/scripts/install_alt_ai.py): Installs Ollama + pulls the vision model.
- [sprezzature-audio/scripts/captions_from_whisper.py](sprezzature-audio/scripts/captions_from_whisper.py): WebVTT / SRT captions via pywhispercpp.
- [sprezzature-audio/scripts/install_captions.py](sprezzature-audio/scripts/install_captions.py): Installs pywhispercpp + model.
- [sprezzature-ux-laws/scripts/audit_laws_of_ux.py](sprezzature-ux-laws/scripts/audit_laws_of_ux.py): Static auditor for the canonical Laws of UX. Stdlib only; HTML-aware findings via JSON or stdout; exit codes for pre-commit / CI; `--only` / `--ignore` / `--strict`.
- [sprezzature-colors/scripts/palette_to_tailwind.py](sprezzature-colors/scripts/palette_to_tailwind.py): Make-side emitter — renders `sprezzature-colors/references/palette.csv` as a Tailwind `theme.extend.colors` block (default) or a full `tailwind.config.js` (`--emit config`). Optional `--with-dark` derives OKLCH-L-bumped dark variants. Single source of truth: the CSV.

## Assets

- [sprezzature-ui/assets/starter-page.html](sprezzature-ui/assets/starter-page.html): Single-file page bootstrap (Montserrat + Tailwind + tokens).
- [sprezzature-ui/assets/components/](sprezzature-ui/assets/components/): Copy-paste HTML snippets + Vega-Lite chart specs.
- [sprezzature-ui/assets/fonts/montserrat/](sprezzature-ui/assets/fonts/montserrat/): Montserrat WOFF2 + `OFL.txt` + `fonts.css`.
- [sprezzature-cli-gui/assets/examples/cli-gui-demo/](sprezzature-cli-gui/assets/examples/cli-gui-demo/): Runnable CLI → GUI worked example.

## Optional

- [README.md](README.md): Human-facing English README with the "Inputs → outputs" table and the audience definition.
- [LISEZMOI.md](LISEZMOI.md): Human-facing French README (legacy — pending 0.2.0 parity update).
- [LANDSCAPE.md](LANDSCAPE.md): Comparison matrices vs alternatives.
- [CHANGELOG.md](CHANGELOG.md): Release notes (0.2.0 = the four-skill split).
- [CONTRIBUTING.md](CONTRIBUTING.md): How to propose changes.
- [LICENSE.md](LICENSE.md): BSD-3-Clause + Roboto OFL carve-out.