Overview
Getting started
Install structyl and render your first component.
1. Install
bash
pnpm add @structyl/styled @structyl/themes2. Add the Tailwind preset
ts
// tailwind.config.ts
import preset from '@structyl/styled/tailwind-preset';
export default {
presets: [preset],
content: ['./src/**/*.{ts,tsx}'],
};3. Wrap your app in ThemeProvider
tsx
import { ThemeProvider } from '@structyl/themes';
export default function App({ children }) {
return <ThemeProvider defaultTheme="slate">{children}</ThemeProvider>;
}4. Use a component
tsx
import { Button } from '@structyl/styled';
export default function Page() {
return <Button>Hello structyl</Button>;
}Or use the CLI
Scaffold a project and copy component source directly into your codebase.
bash
npx structyl init
npx structyl add button dialog select