Skip to content
Support Yumma CSS by starring us on GitHub!

Yumma CSS and Svelte

Learn how to integrate Yumma CSS with Svelte.

  1. Install Yumma CSS:

    Install the Yumma CSS Library using a package manager.

    Installing dependencies...
    npm install yummacss@latest
  2. Include yummacss in your main CSS file:

    In this case, we’re importing the minified version of Yumma CSS.

    Create a new /src/global.css file

    src/global.css
    @import "/node_modules/yummacss/dist/yumma.min.css";
  3. Import the CSS file

    Create a /src/routes/+layout.svelte file

    routes/+layout.svelte
    <script>
    import "../global.css";
    </script>
    <slot />
  4. Start development server

    Start your application using npm run dev.

    Starting development server...
    npm run dev
  5. Done!

    You’re all set to start using Yumma CSS utility classes in your project.

    routes/+page.svelte
    <h1 class="fs-sm fw-700 ta-c tc-indigo">Yumma CSS 🤝 Svelte</h1>

Clone this project

You can clone the project from the GitHub repository.

Cloning the project...
git clone https://github.com/yumma-lib/svelte-example.git