Installation

Install Yumma CSS using the CLI or CDN.

Set up Yumma CSS

Follow these steps to get started with Yumma CSS.

Use the CLI

Install Yumma CSS with your favorite package manager:

  1. 1

    Install Yumma CSS

    pnpm add yummacss -D
  2. 2

    Initialize configuration

    Create a configuration file in your project.

    pnpx yummacss init
  3. 3

    Configure sources

    Specify the locations/paths of your project files in the config file.

    import { defineConfig } from "yummacss";

export default defineConfig({
  source: ["./src/**/*.{ts,tsx}"],
  output: "./src/styles.css",
});
  4. 4

    Build styles

    Start using Yumma CSS classes, then generate your styles.

    pnpx yummacss build

Use the CDN

Import Yumma CSS directly into your HTML file via CDN for quick prototyping.

  1. 1

    Import script

    <script src="https://unpkg.com/@yummacss/runtime"></script>
  2. 2

    Start styling

    <!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://unpkg.com/@yummacss/runtime"></script>
</head>

<body class="bg-black">
  <h1 class="c-white">Hello World</h1>
</body>

</html>