Placeholders

Default examples of Placeholders

You can use the Classes for width .w-15p = 15px
.w-15p .w-25p .w-50p .w-70p .w-100p .w-125p

How it works

Create placeholders with the .placeholder class and a grid column class (e.g., .col-6 ) to set the width. They can replace the text inside an element or be added as a modifier class to an existing component.

The use of aria-hidden="true" only indicates that the element should be hidden to screen readers.
Color

By default, the placeholder uses currentColor. This can be overridden with a custom color or utility class.

Animation

Animate placeholders with .placeholder-glow or .placeholder-wave to better convey the perception of something being actively loaded.