Opinionated design language + token-driven React components. 31 presets, 70+ components, one markdown file. Built to kill the AI-generated aesthetic.
This repository also configures its own agents. See what Sigil-UI tells them →
Skill Claude CodeCodex needs its repo
The auditor crawls every /docs/components/ page on the local dev server and combines static MDX analysis with a real Chromium browser pass.
Skill Claude CodeCodex
Consolidated reference for the @sigil-ui/cli command surface (init, convert, add, preset, design, inspire, adapter, docs, diff, doctor). Use when looking up what a CLI command does, picking between sigil init and sigil convert, scaffolding a new project, switching presets, generating DESIGN.md, validating a project…
Skill Claude CodeCodex
Every Sigil component lives in packages/components/src/ and follows this pattern.
Skill Claude CodeCodex
Generate, parse, and compile a unified DESIGN.md (33 categories, 519 tokens) that compiles to CSS, Tailwind v4, and W3C JSON. Use when creating a new design reference, extracting tokens from an existing site (sigil design extract), switching a project's visual identity, generating compiled token output, or auditing a…
Skill Claude CodeCodex needs its repo
Sigil page code should describe content and structure. Token math, snap padding, gutter phase, and divider stroke placement live inside package primitives.
Skill Claude CodeCodex
Canonical source of truth for Sigil positioning, copy, stats, naming, and tone. Use when writing or updating any README, docs page, marketing surface, llms.txt, social post, or agent-generated copy that mentions Sigil. Triggers on "Sigil messaging", "Sigil copy", "what is Sigil", "Sigil positioning", "Sigil stats"…
Skill Claude CodeCodex
Before migrating, audit the existing project.
Skill Claude CodeCodex
The Sigil Playbook codifies the small vocabulary of structural patterns that make any new page "just work." Originating from the Reticle design language (Dedalus monorepo), these 10 rules — 6 compositional moves + 4 supporting patterns — replace dozens of ad-hoc layout decisions.
Skill Claude CodeCodex
Design engineering principles for making Sigil interfaces feel polished. Use when building UI components, reviewing frontend code, implementing animations, hover states, shadows, borders, typography, micro-interactions, enter/exit animations, or any visual detail work. Triggers on UI polish, design details, "make it…
Skill Claude CodeCodex
Every custom preset MUST populate ALL 33 token categories and ALL fields.
Skill Claude CodeCodex
Author and extract .scene.tsx files for animated or stateful blocks of an apps/web page. Use when extracting a self-contained visual/animated block from a long page file (the goal is one scene per file, page composes scenes), creating a new animation/diagram block, or refactoring a god file into scene-shaped modules.…
Skill Claude CodeCodex
Skill "sigil-tokens" from Kevin-Liu-01/Sigil-UI, covering sigil tokens, when to use, how to use, 1. token architecture and 2. token categories.
At most 3 mods per repository are shown here, and a mod shipped inside a plugin is left to that plugin's page — the rest are on their repository pages: