Design Manager

Colors
Typography (Fonts)
Sizes and paddings
Border & border radius

AI Assistant

Ask our AI Assistant to create a design for your new project.



Components

Token-based, clean and powerfull CSS freamework with design token manager and JS extensions. Create HTML structure once, customize design with tokens. Lightweight and Ready to be used in Web sites, Landing pages along with Admin dashboards and interfaces.



Form


  • Preview
  • Code
  • Figma
  • Tokens
  • Properties
  • Styles

Dialog

Dialog - popup dialog

  • Preview
  • Code
  • Figma
  • Tokens
  • Properties
  • Styles

Page title

Page title

  • Preview
  • Code
  • Figma
  • Tokens
  • Properties
  • Styles

Hero


v0.1

Modern token based CSS Framework

Token-based, clean and powerfull CSS freamework with design token manager and JS extensions. Create HTML structure once, customize design with tokens. Lightweight and Ready to be used in Web sites, Landing pages along with Admin dashboards and interfaces.


  • Preview
  • Code
  • Figma
  • Tokens
  • Properties
  • Styles

Card

Card example

  • Preview
  • Code
  • Figma
  • Tokens
  • Properties
  • Styles

Alert

To get all headers we need a mino.js plug-in, to send server requests with same config and get full text response.

  • Preview
  • Code
  • Figma
  • Tokens
  • Properties
  • Styles

Header


  • Preview
  • Code
  • Figma
  • Tokens
  • Properties
  • Styles

Notification

To get all headers we need a mino.js plug-in, to send server requests with same config and get full text response.

  • Preview
  • Code
  • Figma
  • Tokens
  • Properties
  • Styles

Accordion

Details summary text
Details summary 2 text 2
Details summary 3 text 3

  • Preview
  • Code
  • Figma
  • Tokens
  • Properties
  • Styles


Build better UI, faster

Get updates on new features, tools, and ideas behind MinoCSS.





MinoCSS is not another CSS framework.
It’s a design system engine for developers.

Explore tokens