Documentation
Styling and Tailwind Customization
Customize colors, typography, and spacing with Tailwind.
Tailwind config
Update theme tokens in tailwind.config.cjs:
extend: {
colors: {
primary: {
100: '#dd429d',
200: '#b14bf4',
300: '#485cfb'
}
}
}
Global styles
Global styles live in src/styles/global.css. Keep changes minimal and prefer Tailwind utilities in components.
Component styling
Use utility classes directly in Astro components. This keeps styles close to the markup and easy to maintain.