Helpful classes
Helpful classes you can use inside Kirby textarea or Kirby Editor.

Button

You can convert any link in Kirby markdown to the button with these classes
Classes to add
Button style.
.uk-button .uk-button-default
Default color
.uk-button .uk-button-primary
Primary color
.uk-button .uk-button-secondary
Secondary color
.uk.button .uk-button-danger
Indicates a dangerous or negative action.
.uk-button .uk-button-text
Applies an alternative, typographic style.
.uk-button .uk-button-default .uk-button-large
Make button larger
.uk-button .uk-button-default .uk-button-small
Make button smaller

Margin

Many useful classes, check https://getuikit.com/docs/margin

Padding

Align

Useful for images.
Class
Description
.uk-align-left
Floats the element to the left and creates right and bottom margin.
.uk-align-right
Floats the element to the right and creates the left and bottom margin.
.uk-align-center
Centers the element and creates the bottom margin.

Width

Class
Description
.uk-width-1-1
Fills 100% of the available width.
.uk-width-1-2
The element takes up halves of its parent container.
.uk-width-1-3 to .uk-width-2-3
The element takes up thirds of its parent container.
.uk-width-1-4 to .uk-width-3-4
The element takes up fourths of its parent container.
.uk-width-1-5 to .uk-width-4-5
The element takes up fifths of its parent container.
.uk-width-1-6 to .uk-width-5-6
The element takes up sixths of its parent container.

Height

Class
Description
.uk-height-1-1
This class applies a height of 100%. This only works if the parent element has a set height.
.uk-height-small
.uk-height-max-small
These classes apply a height or max-height of 150px.
.uk-height-medium
.uk-height-max-medium
These classes apply a height or max-height of 300px.
.uk-height-large
.uk-height-max-large
These classes apply a height or max-height of 450px.

Utility

Also, many useful classes can be found at https://getuikit.com/docs/utility

Tricks

You can see some examples of how to use these classes at