Installation
Yumma CSS is a CSS framework packed with a set of abbreviated utility classes for building faster and more maintainable UIs.
Installation guide
Yumma CSS comes with the Yumma CLI, a powerful tool that’s a breeze to set up and takes no time or effort for production-ready projects.
-
Install Yumma CSS
Add
yummacss
to your project.Terminal pnpm add yummacss -DTerminal npm i yummacss -DTerminal yarn add yummacss -D
-
Initialize configuration
Create a configuration file in your project.
Terminal pnpx yummacss initTerminal npx yummacss initTerminal yarn dlx yummacss init -
Set up configuration
Specify the locations of all your project files in the config file.
yumma.config.js export default {source: ["./src/**/*.{ts,tsx}"],output: "./src/styles.css",buildOptions: {reset: true,minify: false,},}; -
Build styles
You can now start generating your CSS with the
build
orwatch
command.Terminal pnpx yummacss buildTerminal npx yummacss buildTerminal yarn dlx yummacss build
Framework guides
Yumma CSS works with any framework, seriously! Try it out with your favorite one.
Next steps
Take your first steps toward mastering Yumma CSS and its incredible core features.
Styling elements: Learn how to style elements and styling patterns in “Styling elements”.
Conditional styles: Discover how to apply styles conditionally in “Conditional styles”.
Building styles: Understand the build process and commands in “Building styles”.
Production mode: Optimize your CSS for production in “Production mode”.
Color system: Explore the comprehensive color system in “Color system”.