sveltewind Svelte Themes

Sveltewind

Customizable components with TailwindCSS styling for seamless integration into any Svelte project

sveltewind

Customizable components with TailwindCSS styling for seamless integration into any SvelteKit project.

Installation (Option 1)

npm i -D @codepiercer/sveltewind
  • Create a tailwind.config.cjs file in the root of your project and add the following:

    // tailwind.config.cjs
    module.exports {
      presets: require('@codepiercer/sveltewind/config.cjs')
    }
    
  • Create a postcss.config.cjs file in the root of your project and add the following:

    // postcss.config.cjs
    module.exports = {
      plugins: {
        tailwindcss: {},
        autoprefixer: {}
      }
    }
    

Installation (Option 2) - use the pre configured sveltekit template

npx degit [email protected]:codepiercer/sveltewind-template.git myapp

Usage

// Example.svelte
<script>
  import { Button } from '@codepiercer/sveltewind/components'
</script>

<Button.Primary class="text-green-500">Click Me</Button.Primary>

Development

docker compose --service-ports run --rm app
npm i
npm run dev

© CODEPIERCER. All rights reserved.

Top categories

Loading Svelte Themes