Some basic elements that you will need to build your website or your app.
Dropdown styles and variations
Modal dialog sizes and variations
Bulma pagination styles and variations
Bulma progress bar styles and variations
Bulma tag and badges styles
Avatar images size examples
Class helpers shipped with Minimal
Class | Values | Description |
---|---|---|
.text-* | white, primary, light, muted, medium | Sets the target element's color to the specified value |
.bg-* | white, primary, light, muted, medium | Sets the target element's background color to the specified value |
.border-* | white, primary, light, muted, medium | Sets the target element's border color (2px width) to the specified value |
.opacity-* | 5, 10, 15, 20, 25, 30, 40, 50, 60, 70, 80, 90, 100 | Sets the target element's opacity to the specified value |
.p-* | 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16, 20, 24, 32, 40, 48, 56, 64 | Sets the target element's padding to the specified value (see _utilities.scss) |
.px-* | 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16, 20, 24, 32, 40, 48, 56, 64 | Sets the target element's horizontal padding to the specified value (see _utilities.scss) |
.py-* | 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16, 20, 24, 32, 40, 48, 56, 64 | Sets the target element's vertical padding to the specified value (see _utilities.scss) |
.pt-* | 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16, 20, 24, 32, 40, 48, 56, 64 | Sets the target element's top padding to the specified value (see _utilities.scss) |
.pb-* | 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16, 20, 24, 32, 40, 48, 56, 64 | Sets the target element's bottom padding to the specified value (see _utilities.scss) |
.pl-* | 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16, 20, 24, 32, 40, 48, 56, 64 | Sets the target element's left padding to the specified value (see _utilities.scss) |
.pr-* | 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16, 20, 24, 32, 40, 48, 56, 64 | Sets the target element's right padding to the specified value (see _utilities.scss) |
.m-* | 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16, 20, 24, 32, 40, 48, 56, 64 | Sets the target element's margin to the specified value (accepts negative values: -m-*) |
.mx-* | 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16, 20, 24, 32, 40, 48, 56, 64 | Sets the target element's horizontal margin to the specified value (accepts negative values: -m-*) |
.my-* | 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16, 20, 24, 32, 40, 48, 56, 64 | Sets the target element's vertical margin to the specified value (accepts negative values: -m-*) |
.mt-* | 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16, 20, 24, 32, 40, 48, 56, 64 | Sets the target element's top margin to the specified value (accepts negative values: -m-*) |
.mb-* | 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16, 20, 24, 32, 40, 48, 56, 64 | Sets the target element's bottom margin to the specified value (accepts negative values: -m-*) |
.ml-* | 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16, 20, 24, 32, 40, 48, 56, 64 | Sets the target element's left margin to the specified value (accepts negative values: -m-*) |
.mr-* | 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16, 20, 24, 32, 40, 48, 56, 64 | Sets the target element's right margin to the specified value (accepts negative values: -m-*) |
.max-w-* | 1, 2, 3, 4, 5, 6, 7, 8, 9, full | Sets the target element's max-width to the specified value |
.size-*x* | 24, 28, 32, 36, 40, 44, 48, 52, 56, 60, 64, 70, 80, 90, 100, 110, 120, 130, 140, 150, 175, 200 | Sets the target element's height and width to the specified value |
.text-* | uppercase, capitalize, italic | Sets the target element's font style to the specified value |
.is-weight-* | 300, 400, 500, 600, 700, 800, 900 | Sets the target element's font weight to the specified value |
.rem-* | 70, 75, 80, 85, 90, 95, 100, 115, 125, 150, 175, 200, 225, 250, 275, 300 | Sets the target element's font size (in rem) to the specified value |
You need to customise this template or you need a brand new design? Hit us.
You an issue or simply want to ask a question? Feel free to open a ticket.