text-emphasis-color

La propiedad CSS text-emphasis-color (que podría traducirse como color del texto con énfasis) define el color de las marcas de énfasis. Este valor también puede definirse usando el atajo text-emphasis

/* Valor inicial*/
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;

/* Valores globales */
text-emphasis-color: inherit;
text-emphasis-color: initial;
text-emphasis-color: unset;

Valor inicial	`currentcolor`
Applies to	all elements
Heredable	no
Media	visual
Valor calculado	computed color
Animation type	a color
Canonical order	el orden único no-ambigüo definido por la gramática formal

Sintáxis

Valores

<color>: Define el color de las marcas de énfasis. Si ningún color es declarado, el color por defecto es currentColor (color actual).

Sintáxis Formal

<color>where 
<color> = <rgb()> | <rgba()> | <hsl()> | <hsla()> | <hex-color> | <named-color> | currentcolor | <deprecated-system-color>
where 
<rgb()> = rgb( <percentage>{3} [ / <alpha-value> ]? ) | rgb( <number>{3} [ / <alpha-value> ]? ) | rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? )
<rgba()> = rgba( <percentage>{3} [ / <alpha-value> ]? ) | rgba( <number>{3} [ / <alpha-value> ]? ) | rgba( <percentage>#{3} , <alpha-value>? ) | rgba( <number>#{3} , <alpha-value>? )
<hsl()> = hsl( <hue> <percentage> <percentage> [ / <alpha-value> ]? ) | hsl( <hue>, <percentage>, <percentage>, <alpha-value>? )
<hsla()> = hsla( <hue> <percentage> <percentage> [ / <alpha-value> ]? ) | hsla( <hue>, <percentage>, <percentage>, <alpha-value>? )
where 
<alpha-value> = <number> | <percentage>
<hue> = <number> | <angle>

Ejemplos

CSS

h3 {
  text-emphasis-color: #555;
  text-emphasis-style: "*";
}

HTML

<p>Este es un ejemplo:</p>

<h3>Esto está marcado con énfasis!</h3>

Resultado

Ejemplo incrustado en vivo

Especificaciones

Especificaciones	Estado	Comentario
CSS Text Decoration Module Level 3 La definición de 'text-emphasis' en esta especificación.	Candidate Recommendation	Initial definition

Compatibilidad de Navegadores

Update compatibility data on GitHub

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome para Android	Firefox para Android	Opera para Android	Safari en iOS	Samsung Internet
`text-emphasis-color`	Chrome Soporte completo 25 Soporte completo 25 Soporte completo 25 Prefijado Prefijado Requiere de un prefijo de vendedor : -webkit-	Edge Sin soporte No	Firefox Soporte completo 46 Soporte completo 46 Sin soporte 45 — 49 Deshabilitado Deshabilitado From version 45 until version 49 (exclusive): this feature is behind the `layout.css.text-emphasis.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	IE Sin soporte No	Opera Soporte completo 15 Soporte completo 15 Soporte completo 15 Prefijado Prefijado Requiere de un prefijo de vendedor : -webkit-	Safari Soporte completo 6.1 Soporte completo 6.1 Soporte completo 6.1 Prefijado Prefijado Requiere de un prefijo de vendedor : -webkit-	WebView Android Soporte completo 4.4 Soporte completo 4.4 Soporte completo 4.4 Prefijado Prefijado Requiere de un prefijo de vendedor : -webkit-	Chrome Android Soporte completo 25 Soporte completo 25 Soporte completo 25 Prefijado Prefijado Requiere de un prefijo de vendedor : -webkit-	Firefox Android Soporte completo 46 Soporte completo 46 Sin soporte 45 — 49 Deshabilitado Deshabilitado From version 45 until version 49 (exclusive): this feature is behind the `layout.css.text-emphasis.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	Opera Android Soporte completo 14 Soporte completo 14 Soporte completo 14 Prefijado Prefijado Requiere de un prefijo de vendedor : -webkit-	Safari iOS Soporte completo 7 Soporte completo 7 Soporte completo 7 Prefijado Prefijado Requiere de un prefijo de vendedor : -webkit-	Samsung Internet Android Soporte completo 1.5 Soporte completo 1.5 Soporte completo 1.5 Prefijado Prefijado Requiere de un prefijo de vendedor : -webkit-

Leyenda

Soporte completo: Soporte completo
Sin soporte: Sin soporte
El usuario debe de habilitar explícitamente esta característica.: El usuario debe de habilitar explícitamente esta característica.
Requiere de un prefijo de proveedor o un de nombre diferente para su uso.: Requiere de un prefijo de proveedor o un de nombre diferente para su uso.

Ver También

El tipo de dato <color>.
Las otras propiedades de marcas de énfasis relacioanadas: text-emphasis-style, text-emphasis, y text-emphasis-position.
Otras propiedades relacionadas al color: color, background-color, border-color, outline-color, text-emphasis-color, text-shadow, caret-color, y column-rule-color
Aplicando color a los elementos HTML utilizando CSS.