Drop the @salty-css/astro Integration into astro.config.mjs and Compile Styles With Zero Client Cost
Getting Started with Salty CSS in an Astro Project
Everything you need to get a Salty CSS project off the ground. Start with the Quick Start for a fifteen-minute end-to-end walkthrough, or jump into Installation if you'd rather wire the build plugin into an existing app. The remaining pages cover day-to-day Usage, the CLI, ESLint support, common Troubleshooting, and FAQ answers.
In this section
- Quick Start for AstroSet up Salty CSS in ~15 minutes — install with the CLI, write your first typed component, add variants, ship dark mode, and register a custom font.
- Add the Salty CSS Integration to an Astro ProjectInstall Salty CSS and wire up the build-time plugin for your framework.
- Using Salty CSS in .astro and .tsx FilesBuild and consume Salty CSS components inside your application code.
- Troubleshooting Salty CSS in Astro BuildsDiagnose common Salty CSS issues — missing styles, build errors, framework-detection mistakes, and SSR caveats.
- salty-css CLI for Astro ProjectsUse the salty-css command-line interface to scaffold, generate, and build your project.
- ESLint Plugin for Astro ProjectsCatch missing exports and misplaced variants in Salty CSS files with the official ESLint plugin and shareable config.
- Common Questions From Astro TeamsShort answers about Salty CSS — what it is, how the build works, theming without a provider, React Server Components, fonts, TypeScript, and incremental adoption.