Stooge CSS
A powerful, intuitive CSS framework for fast web development
Stooge CSS Documentation
Visibility and Box-Model
Use the green columns (second and fourth columns) to get the property and value you want eg mt-05. Seperate it by a '-' dash.
| Property | Abbrev | Value | Abbrev | Units |
| opacity | op | 100, 90, 80, 70, 60, 50, 40, 30, 20, 10, 05, 025, 0 | ||
| visibility | visible | visibility: visible | ||
| visibility | hidden | visibility: invisible | ||
| background-position | bp | left-top | lt | |
| background-position | bp | left-bottom | lb | |
| background-position | bp | right top | rt | |
| background-repeat | br | repeat | rp | |
| background-repeat | br | no-repeat | nr | |
| background-repeat | br | repeat-x | rx | |
| background-repeat | br | repeat-y | ry | |
| background-size | bs | cover | cv | |
| background-size | bs | contain | cn | |
| border-style | bt | dotted | dotted | |
| border-style | bt | dashed | dashed | |
| border-style | bt | solid | solid | |
| border-style | bt | none | none | |
| border-width | bw | 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 | px not rem | |
| border-style and border-width | bsw | 0, 1, 2, 3, 4, 5, 6, 7 | px not rem | |
| border-top-width | btw-0 | Make a side border width zero. | ||
| border-right-width | brw-0 | Make a side border width zero. | ||
| border-bottom-width | bbw-0 | Make a side border width zero. | ||
| border-left-width | blw-0 | Make a side border width zero. | border-top-width | btw | solid, 1px | 1 | px not rem |
| border-right-width | brw | solid, 1px | 1 | px not rem |
| border-bottom-width | bbw | solid, 1px | 1 | px not rem |
| border-left-width | blw | solid, 1px | 1 | px not rem |
| border-radius | br | 0, 0125, 025, 05, 075, 1, 125, 15, 175, 2, 225, 25, 3, 4, 5, 6, 7 | ||
| border-radius | br | 9999px | pill | |
| border-top-left-radius | btlr | 0 | 0 | |
| border-top-right-radius | btrr | 0 | 0 | |
| border-bottom-left-radius | bblr | 0 | 0 | |
| border-bottom-right-radius | btlr | 0 | 0 | |
| outline | outline | outline: 1px solid; | ||
| outline | outline-transparent | outline: 1px solid transparent; | ||
| outline | ou | 0 | 0 | |
| cursor | cursor | auto | auto | |
| cursor | cursor | default | default | |
| cursor | cursor | pointer | pointer | |
| cursor | cursor | wait | wait | |
| cursor | cursor | move | move | |
| cursor | cursor | not-allowed | not-allowed |
Special case CSS class names and classes with more than one property and classes that are different to the Stooge CSS name format.
Border and Border-radius
bo-pink-12
bsw-5
br-3 bo-pink-12 bsw-2
br-1 bo-pink-12 bw-025 bt-dashed
Opacity
op-70
op-40