#### Content - Text Styling

Statistics Invoices Schedule

##### Contextual text colors

Convey meaning through color with a handful of emphasis utility classes. These may also be applied to links and will darken on hover just like our default link styles. Contextual text classes also work well on anchors with the provided hover and focus states. Note that the `.text-white` and `.text-muted` class has no link styling. You can also easily set the background of an element to any contextual class.

Text | Link | Description
--- | --- | ---
Muted text color | Muted link color | For muted inline text and text link color use `.text-muted` class added to the link or text container
Secondary text color | Secondary link color | For secondary inline text and text link color use `.text-secondary` class added to the link or text container
Dark text color | Dark link color | For dark inline text and text link color use `.text-dark` class added to the link or text container
Default text color | Default link color | For default inline text and text link color use `.text-default` class added to the link or text container
Primary text color | Primary link color | For primary inline text and text link color use `.text-primary` class added to the link or text container
Danger text color | Danger link color | For danger inline text and text link color use `.text-danger` class added to the link or text container
Success text color | Success link color | For success inline text and text link color use `.text-success` class added to the link or text container
Warning text color | Warning link color | For warning inline text and text link color use `.text-warning` class added to the link or text container
Info text color | Info link color | For info inline text and text link color use `.text-info` class added to the link or text container
Custom text color | Custom link color | For custom inline text and text link color use `.text-*` color class added to the link or text container
White text color | White link color | For white inline text and text link color use `.text-white` class added to the link or text container

##### Text options

Limitless template supports the majority of all possible text styling options - weights, sizes, styles and additional elements such as marks, abbreviations, keyboard inputs, sample and variable inputs etc. All these stylings can be applied any section heading, form components, content and UI elements just by adding proper class to the element. Basic text styles are included to BS framework by default, Limitless includes more extended typography.

Example | Description
--- | ---
Links
This is a default link | Default style for `<a>` element
This is a text color link | To use a link with default text color link, add `.text-default` class
This is a contextual color link | To use a link with contextual color link, add `.text-danger` or any other contextual class
This is a custom color link | To use a link with custom color link, add `.text-purple-300` or any other text color class
Font weight
This is a thin text | For thin font weight use `.font-weight-thin` class
This is a light text | For light font weight use `.font-weight-light` class
This is a regular text | For forced regular font weight use `.font-weight-normal` class
This is a semibold text | For semibold font weight use `.font-weight-semibold` class
This is a bold text | For bold font weight use `.font-weight-bold` class
This is a black text | For black font weight use `.font-weight-black` class
Font style
This is an italic text | For italic font style use `.font-italic` class
This is an uppercase text | For uppercase text transformation use `.text-uppercase` class
This is a lowercase text | For lowercase text transformation use `.text-lowercase` class
This is a capitalized text | For capitalize text transformation use `.text-capitalize` class
This is a deleted text | For indicating blocks of text that have been deleted use the `<del>` tag
This is a strikethrough text | For indicating blocks of text that are no longer relevant use the `<s>` tag
This is an underlined text | To underline text use the `<u>` tag
This is a truncated text with an ellipsis | For longer content, you can add a `.text-truncate` class to truncate the text with an ellipsis
Font size
This is a larger text size | For larger text size use `.font-size-lg` class
This is a default text size | Default font size is `13px`, doesn't require any special classes
This is a smaller text size | For smaller text size use `.font-size-sm` class
This is a mini text size | For mini text size use `.font-size-xs` class
Text elements
This is a highlighted text | For text highlighting in another context, use the `<mark>` tag
This is a inserted text | For indicating additions to the document use the `<ins>` tag
Basic abbreviation | For expanded text on abbr hover, use the `<abbr>` element
Abbreviation with initialism | Add `.initialism` to an abbreviation for a slightly smaller font-size
Press `ctrl + ,` to edit | Use the `<kbd>` to indicate input that is typically entered via keyboard
y = mx + b | Use the `<var>` to indicate variables
`This is a sample text` | Use the `<samp>` to indicate blocks sample output from a program
`Inline code snippet` | Wrap inline snippets of code with `<code>`
This is a sub text | Use `<sub>` tag to display subscripted text
This is a sup text | Use `<sup>` tag to display superscripted text
Small text | Use `<small>` tag to display smaller text
Text alignment
Left aligned text | For left text alignment, use `.text-left` alignment class. You can also use viewport classes `.text-[sn, md, lg, xl]-left` for better alignment control
Centered text | For centered text, use `.text-center` alignment class. You can also use viewport classes `.text-[sn, md, lg, xl]-center` for better alignment control
Right aligned text | For right text alignment, use `.text-right` alignment class. You can also use viewport classes `.text-[sn, md, lg, xl]-right` for better alignment control
Justified text | For justified text, use `.text-justify` alignment class
No wrap text | For no wrap text, use `.text-nowrap` alignment class