AniStyl
DemoExamplesDocsPricingAccountCreate yours
DocumentationAniStyl Docs
Getting Started
Overview
Frameworks
HTML React Next.js Vue Other
Workflow
Import from URL Import from Figma Customize Download Regenerate
Developer
Tokens Components SCSS CSS Layout & grid Utilities Fonts Dark mode CLI Agent Skill
Support
Licence & support
Open builderFree · live preview · no account

Other - Svelte, Astro, Hugo, static

If it serves HTML, it works. Link the CSS - no runtime.

<link rel="stylesheet" href="/my-design-system/dist/my-design-system.min.css" />
  • Svelte / SvelteKit: import in +layout.svelte.
  • Astro: import in Layout.astro frontmatter.
  • Hugo / Jekyll: copy dist/*.min.css to static/.

Tokens and components are identical across stacks. See Tokens and Components.

AniStyl

Generate a design system that is actually yours. MIT licensed output - we could disappear tomorrow and your code keeps working.

ProductThe builderExamplesDocsComponentsPricingQuestions
Supportsupport@anistyl.comYour account & buildsDonate - keep it running
LegalTerms of ServicePrivacy PolicyRefund Policy
This site runs on its own generated design system - fluid scales, an HSL colour map, one accent.