Skip to content
Visuals and effects

content

Generates content for `::before` and `::after` pseudo-elements. The pseudo-element is not created unless `content` is specified, even when the value is empty.

2,843 effects in the catalog use this property.

Syntax

content: '' | '<text>' | attr(<attribute>) | counter(...);

Watch out

Use `content: ''` for decorative pseudo-elements. Meaningful text inserted through CSS can be announced inconsistently by assistive technology and should remain in the document instead.

Effects using content

These are working effects from the catalog. Open a tile to inspect the full source.