Core
A theme builder for Astro and Tailwind. Pick six colors and a type scale, watch this site restyle itself, then paste the result into your project.
Two files, one paste
- global.css
- Six brand colors and the fluid type scale — the only parts of a theme that genuinely have to be CSS, because only they are arbitrary.
- theme-rules.md
- Spacing, radius, elevation, borders and motion as plain Tailwind conventions. Written to be read once by an agent, rather than re-explained every session.
How to use it
One procedure, two ways to run it. If you work with a coding agent, hand it the link and it can do the whole thing — core.koval.dev/llms.txt is these same steps, written for a machine.
Ask an agent
Start an Astro project for a small law firm site — established, not stuffy.
Theme it with Koval Core: follow the instructions at core.koval.dev/llms.txtIt reads the vocabulary, turns the brief into a config, fetches global.css and theme-rules.md from a /r/… URL, and points AGENTS.md at them. From then on it knows the corners are sharp without being told again.
Give it @kovaldev/core-mcp as well and it can do more than the URL allows — search the font and icon catalogues, and derive a palette from one color rather than naming six:
{ "mcpServers": {
"kovalCore": { "command": "npx", "args": ["-y", "@kovaldev/core-mcp"] }
} }Or start one by hand
- Scaffold the starter:
npm create astro@latest my-site -- --template koval-dev/astro-starter - Open the theme builder and pick a palette, a type scale and the conventions. The site restyles itself as you go, so what you are looking at is the theme.
- Get the files — download
global.cssoversrc/styles/global.css, and puttheme-rules.mdin the project root. - Copy the Link tab’s block into
AGENTS.md. There is one ready forCLAUDE.md, Cursor and Copilot too — take one, not four. - Do what the Fonts and Icons sections of
theme-rules.mdsay: oneastro.config.mjsblock and onenpm i, both written for the theme you just made.
- Re-theming
- Replace both files and rebuild. Nothing else moves — the conventions are Tailwind classes already in your markup, and the ink ladder follows the six brand values rather than being baked against them.
- Several clients
- The
/r/…link is the record of what a theme is. Keep it in the project. The payload is the identity, so the same link can only ever produce the same bytes. - Missing a word
- The vocabulary is deliberately small. When a project needs something it does not have, add it here rather than there — a one-off utility beside these conventions is the second house style all of this exists to prevent.