Free downloadOne Design System For You And Your Agent
A free setup guide to Astryx, Meta's open-source React design system, so Claude Code builds pages from one documented system instead of inventing new buttons every time. Install in ten minutes, the agent cheat sheet that astryx init writes, the one prompt I used and the page it built, themes and your own brand, and the tested fix that self-hosts the theme font instead of loading it from Google.
What is inside
- Install Packages, a theme, the two CSS imports and the theme provider, then astryx doctor.
- astryx init The cheat sheet for AGENTS.md and CLAUDE.md: start from a template, no raw divs, colours only through the theme.
- One prompt The exact prompt and the orders dashboard Claude Code built from it, as files you can copy.
- Five prompts New page, form, rebrand, review and ship check, written for Astryx.
- Font fix The neutral theme loads its font from Google. The tested Vite alias that self-hosts it.
- Troubleshooting Unstyled components, peer dependencies, upgrades in the beta.
Node.js 22+ and a React 19 project (Vite or Next.js). Claude Code or another coding agent for the agent part. Astryx is free and open source (MIT, beta). The guide is in English.