We are currently working on a Documentation website!

Until it is ready, you can take a look at how to use basics of Simply-UI here!

You can take a look at the development of the Docs here: https://benjamin-keller.github.io/Simply-UI/docs/

Colors

primary text | secondary text | error text | info text | blue text | red text | green text | yellow text | purple text | orange text | gray text

bg primary | bg secondary | bg error | bg info | bg blue | bg red | bg green | bg yellow | bg purple | bg orange | bg gray |

primary dark 8 | primary dark 6 | primary dark 4 | primary dark 2 | primary | primary light 2 | primary light 4 | primary light 6 | primary light 8 |

hover me

Font Sizes

this is small font
this is medium font
this is large font
this is extra large font
this is extra, extra large font

Buttons

default btn click me click me click me click me click me click me click me click me default btn click me click me click me click me click me click me click me click me

Cards

This is a card title

Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempore natus, sunt at reiciendis sequi enim laudantium vel ab omnis ipsum.


Badges

Primary Secondary Error Info Purple Green Outlined Purple Outlined Green

Grid System

Hello World!

Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempora, cumque!

Hello World!

Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempora, cumque!

Hello World!

Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempora, cumque!

Hello World!

Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempora, cumque!


Toasts

This is a card title

Lorem ipsum dolor sit amet consectetur adipisicing elit.

This is a card title

Lorem ipsum dolor sit amet consectetur adipisicing elit.

This is a card title

Lorem ipsum dolor sit amet consectetur adipisicing elit.

This is a card title

Lorem ipsum dolor sit amet consectetur adipisicing elit.


Form