CSS azimuth

The CSS azimuth property is an aural property that helps you create surround sound on audio devices.

The azimuth property is used for aural presentation. As the CSS specification states:

Spatial audio is an important stylistic property for aural presentation. It provides a natural way to tell several voices apart, as in real life (people rarely all stand in the same spot in a room).

The azimuth property allows you to specify the horizontal position of the voice, either as an angle, or a keyword (eg, left, far-right, etc)

Also see the elevation property for specifying the vertical position of the voice.

Syntax

Possible Values

left-side
Same as '270deg'. With 'behind', '270deg'.
far-left
Same as '300deg'. With 'behind', '240deg'.
left
Same as '320deg'. With 'behind', '220deg'.
center-left
Same as '340deg'. With 'behind', '200deg'.
center
Same as '0deg'. With 'behind', '180deg'.
center-right
Same as '20deg'. With 'behind', '160deg'.
right
Same as '40deg'. With 'behind', '140deg'.
far-right
Same as '60deg'. With 'behind', '120deg'.
right-side
Same as '90deg'. With 'behind', '90deg'.
leftwards
Moves the sound to the left, relative to the current angle - it subtracts 20 degrees.
rightwards
Moves the sound to the right, relative to the current angle - it adds 20 degrees.
inherit
Represents the computed value of the property on the element's parent.

Values are expressed as an angle within the range -360deg to 360deg. 0deg is directly ahead in the center of the sound stage. 90deg is to the right, 180deg behind, and 270deg (or -90deg) to the left.

General Information

Initial Value
center
Applies To
All elements
Inherited?
Yes
Media
Aural

Example Code

Official Specifications