Utilities | Styling Framework

Typography

A list of helper typography utilities.

Class

Target

Result

text-inline

Text-Element, Parent

Sets a text block to inline

text-center

Text-Element, Parent

Sets text alignment to center

Colour

A list of helper colour utilities.

Class

Result

@tablet Background Colour-X

Responsive override to change background colour on different breakpoints.

@h-mobile Background Colour-X

Responsive override to change background colour on different breakpoints.

@v-mobile Background Colour-X

Responsive override to change background colour on different breakpoints.

Blend Top--Background-X

Places a background gradient with colour stop of "Background-A" at the top and a transparent stop at the bottom.

Blend Left--Background-X

Places a background gradient with colour stop of "Background-A" on the left and a transparent stop at the bottom.

Blend Right--Background-X

Places a background gradient with colour stop of "Background-A" on the right and a transparent stop at the bottom.

Blend Bot--Background-X

Places a background gradient with colour stop of "Background-A" at the bottom and a transparent stop at the top.

Layout

A list of helper layout utilities.

Class

Target

Result

overflow--hidden

Any

Set overflow to hidden

image--cover

Image Element

Set image height and width to cover parent container.

video--cover

Video Element

Set video height and width to cover parent container and z-index to "1".

@desktop show

Any

At desktop main breakpoint set display to block

@desktop hide

Any

At desktop main breakpoint set display to none

@tablet show

Any

At tablet breakpoint set display to block

@tablet hide

Any

At tablet breakpoint set display to none

@h-mobile show

Any

At horizontal mobile breakpoint set display to block

@h-mobile hide

Any

At horizontal mobile breakpoint set display to none

@v-mobile show

Any

At vertical mobile breakpoint set display to block

@v-mobile hide

Any

At vertical mobile breakpoint set display to none

Created by TooEasy

Utility Classes