W3cubDocs

text-emphasis-style

The text-emphasis-style CSS property defines the type of emphasis used. It can also be set, and reset, using the text-emphasis shorthand.

/* Initial value */
text-emphasis-style: none; /* No emphasis marks */

/*  value */
text-emphasis-style: 'x';
text-emphasis-style: '点';
text-emphasis-style: '\25B2';
text-emphasis-style: '*';
text-emphasis-style: 'foo'; /* Should NOT use. It may be computed to or rendered as 'f' only */

/* Keywords value */
text-emphasis-style: filled;
text-emphasis-style: open;
text-emphasis-style: filled sesame;
text-emphasis-style: open sesame;

/* Global values */
text-emphasis-style: inherit;
text-emphasis-style: initial;
text-emphasis-style: unset;

Initial value	`none`
Applies to	all elements
Inherited	no
Media	visual
Computed value	as specified
Animation type	discrete
Canonical order	the unique non-ambiguous order defined by the formal grammar

Syntax

Values

none: No emphasis marks.
filled: The shape is filled with solid color. If neither filled nor open is present, this is the default.
open: The shape is hollow.
dot: Display small circles as marks. The filled dot is '•' (U+2022), and the open dot is '◦' (U+25E6).
circle: Display large circles as marks. The filled circle is '●' (U+25CF), and the open circle is '○' (U+25CB).
double-circle: Display double circles as marks. The filled double-circle is '◉' (U+25C9), and the open double-circle is '◎' (U+25CE).
triangle: Display triangles as marks. The filled triangle is '▲' (U+25B2), and the open triangle is '△' (U+25B3).
sesame: Display sesames as marks. The filled sesame is '﹅' (U+FE45), and the open sesame is '﹆' (U+FE46).
<string>: Display the given string as marks. Authors should not specify more than one character in <string>. The UA may truncate or ignore strings consisting of more than one grapheme cluster.

Formal syntax

none | [ [ filled | open ] || [ dot | circle | double-circle | triangle | sesame ] ] | <string>

Examples

h2 {
  text-emphasis-style: sesame;
}

Specifications

Specification	Status	Comment
CSS Text Decoration Module Level 3 The definition of 'text-emphasis' in that specification.	Candidate Recommendation	Initial definition

Browser compatibility

Feature	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari
Basic support	25 -webkit-	?	46 45 — 49¹	No	15 -webkit-	Yes 6.1 -webkit-

Feature

Chrome

Edge

Firefox

Internet Explorer

Opera

Safari

Basic support

25 -webkit-

45 — 49¹

15 -webkit-

Yes

6.1 -webkit-

Feature	Android webview	Chrome for Android	Edge mobile	Firefox for Android	IE mobile	Opera Android	iOS Safari
Basic support	4.4 -webkit-	?	?	46 45 — 49¹	No	33 -webkit-	7.1

Feature

Android webview

Chrome for Android

Edge mobile

Firefox for Android

IE mobile

Opera Android

iOS Safari

Basic support

4.4 -webkit-