# Text

A collection of useful text utility classes to style your content.

## Text styles

UIkit offers various text utlities to style your text.

Class | Description
--- | ---
`.uk-text-small` | Add this class to decrease the font size.
`.uk-text-large` | Add this class to increase the font size.
`.uk-text-bold` | Add this class to create bold text.
`.uk-text-muted` | Add this class to mute your text.
`.uk-text-primary` | Add this class for additional text information.
`.uk-text-success` | Add this class to indicate success.
`.uk-text-warning` | Add this class to indicate a warning.
`.uk-text-danger` | Add this class to indicate danger.
`.uk-text-contrast` | Add this class to make the text color readable on flat color areas or pictures. It's often white.

## Text alignment

Add one of these useful classes to align your text.

Class | Description
--- | ---
`.uk-text-left` | Aligns text to the left.
`.uk-text-left-small` | Aligns text to the left only on small devices.
`.uk-text-left-medium` | Aligns text to the left on medium and small devices.
`.uk-text-right` | Aligns text to the right.
`.uk-text-center` | Centers text horizontally.
`.uk-text-center-small` | Centers text horizontally only on small devices.
`.uk-text-center-medium` | Centers text horizontally on medium and small devices.
`.uk-text-justify` | Justifies text.

### Example

Lorem ipsum dolor sit amet, consetetur sadipscing elitr. `.uk-text-left`
Lorem ipsum dolor sit amet, consetetur sadipscing elitr. `.uk-text-right`
Lorem ipsum dolor sit amet, consetetur sadipscing elitr. `.uk-text-center`
Lorem ipsum dolor sit amet, consetetur sadipscing elitr. `.uk-text-center-small`
Lorem ipsum dolor sit amet, consetetur sadipscing elitr. `.uk-text-center-medium`
Lorem ipsum dolor sit amet, consetetur sadipscing elitr. `.uk-text-justify`

### Vertical alignment

Add one of these classes to vertically align text to an object.

Class | Description
--- | ---
`.uk-text-top` | Aligns text to the top.
`.uk-text-middle` | Centers text vertically.
`.uk-text-bottom` | Aligns text to the bottom.

### Example

Lorem ipsum.
Lorem ipsum.
Lorem ipsum.

## Text wrapping

Add one of these useful classes to wrap your text.

Class | Description
--- | ---
`.uk-text-truncate` | Prevents text from wrapping into multiple lines, truncating it instead.
`.uk-text-break` | Breaks strings if their length exceeds the width of their container.
`.uk-text-nowrap` | Prevents text from wrapping into multiple lines.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt. Lorem ipsum dolor sit amet, consetetur sadipscing elit `.uk-text-truncate`
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt. Lorem ipsum dolor sit amet, consetetur sadipscing elit `.uk-text-break`

Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac.

`.uk-text-nowrap`