text-emphasis-color

The text-emphasis-color CSS property sets the color of emphasis marks. This value can also be set using the text-emphasis shorthand.

Try it

Syntax

css

/* Initial value */
text-emphasis-color: currentcolor;

/* <color> */
text-emphasis-color: #555;
text-emphasis-color: blue;
text-emphasis-color: rgba(90, 200, 160, 0.8);
text-emphasis-color: transparent;

/* Global values */
text-emphasis-color: inherit;
text-emphasis-color: initial;
text-emphasis-color: revert;
text-emphasis-color: revert-layer;
text-emphasis-color: unset;

Values

<color>

Defines the color of the emphasis marks. If no color is present, it defaults to currentcolor.

Formal definition

Initial valuecurrentcolor
Applies toall elements
Inheritedno
Computed valuecomputed color
Animation typea color

Formal syntax

text-emphasis-color = 
<color>

Examples

Emphasis with a color and custom character

CSS

css

em {
  text-emphasis-color: green;
  text-emphasis-style: "*";
}

HTML

html

<p>Here's an example:</p>

<em>This has emphasis marks!</em>

Result

Specifications

Specification
CSS Text Decoration Module Level 3
# text-emphasis-color-property

Browser compatibility

BCD tables only load in the browser

See also