CSS voice-family

The CSS voice-family property is used in speech media to specify the voice family of the speaking voice.

The value is a comma-separated, prioritized list of voice family names. This works similar to the font-family property, where, if the first choice isn't available, the user agent will try the second, and so on.

You can use the voice-family property to specify things like, whether the voice is male or female, whether it's a child or adult, etc. You can also use named values (for example, "Steve", "MC", "old woman", etc) to point to a specific voice instance.

Syntax

Where

Possible Values

The value can be a comma-separated, prioritized list of values. The user agent will attempt to use the first option. If it can't use the first option, it will try the subsequent options. Similar to the font family, it's a good idea to leave a generic voice family as the last option in case the user agent can't support any specific voices.

name

Refers to a specific voice instance. For example, Bruce, announcer, comedian, old woman, cartoon duck, etc.

Voice names must either be given quoted as strings, or unquoted as a sequence of one or more identifiers.

generic-voice

Generic voices include the following values:

age

Possible values are child, young, and old. These translate roughly into ages 6, 24, and 75 respectively (based on the Speech Synthesis Markup Language (SSML)), however, this may depend on the voice-matching algorithm being used.

gender

Possible values are male, female, and neutral.

integer

An integer indicating the preferred variant. For example, the second female child voice. Only positive, non-zero integers are allowed.

For example, a value of 1 indicates that the first matching variant is the preferred voice to be used.

preserve

Indicates that the voice-family value gets inherited and used regardless of any potential language change within the content markup. This value behaves as inherit when applied to the root element.

In addition, all CSS properties also accept the following CSS-wide keyword values as the sole component of their property value:

initial

Represents the value specified as the property's initial value.

inherit

Represents the computed value of the property on the element's parent.

unset

This value acts as either inherit or initial, depending on whether the property is inherited or not. In other words, it sets all properties to their parent value if they are inheritable or to their initial value if not inheritable.

General Information

Example Code

Official Specifications

• CSS Speech Module (W3C Candidate Recommendation 20 March 2012)
• CSS2.1 (W3C Recommendation 07 June 2011)