Text Size
u-text-1
u-text-2
u-text-3
u-text-4
u-text-5
u-text-6
u-text-7
u-text-8
Text Color
u-color-base
Text color base
u-color-dark
Text color dark
u-color-link
Text color link
u-color-muted
Text color muted
u-color-white
Text color white
u-color-positive
Text color positive
u-color-negative
Text color negative
u-color-warning
Text color warning
Font Weight
u-text-light
Font weight light
u-text-normal
Font weight normal
u-text-medium
Font weight medium
u-text-semibold
Font weight semibold
u-text-bold
Font weight bold
Core
u-text-truncate - Truncate text to 1 line with ellipsis
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.
u-text-strike
Text Strike
u-text-clamp - Clamp the sentence to 2 row
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.
u-text-unstyled - text-decoration: none
Text Unstyled
Responsive
mobile, tablet, portable
(Only available for u-text-{size} and u-text-{uppercase/lowercase})
*by default $use-u-text--tablet = false
(Only available for u-text-{size} and u-text-{uppercase/lowercase})
*by default $use-u-text--tablet = false
u-text-2@mobile
Text 2 when mobile size
u-text-uppercase@portable
Text uppercase when tablet and mobile size