Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Selected Reading
CSS voice-range Speech Media property
The CSS voice-range property is used to control the range of pitch variation in speech synthesis. It defines how much the pitch can vary from the base pitch when content is read aloud by screen readers or speech synthesizers.
Syntax
selector {
voice-range: value;
}
Possible Values
| Value | Description |
|---|---|
x-low |
Very narrow pitch range |
low |
Narrow pitch range |
medium |
Normal pitch range (default) |
high |
Wide pitch range |
x-high |
Very wide pitch range |
frequency |
Specific frequency value (e.g., 90Hz) |
Example: Setting Voice Range with Keywords
The following example demonstrates different voice range settings −
<!DOCTYPE html>
<html>
<head>
<style>
.low-range {
voice-range: low;
}
.medium-range {
voice-range: medium;
}
.high-range {
voice-range: high;
}
</style>
</head>
<body>
<p class="low-range">This text has a low pitch range.</p>
<p class="medium-range">This text has a medium pitch range.</p>
<p class="high-range">This text has a high pitch range.</p>
</body>
</html>
When read by a speech synthesizer, the first paragraph will have minimal pitch variation, the second will have normal variation, and the third will have wide pitch variation for more expressive speech.
Example: Using Frequency Values
You can also specify exact frequency values for precise control −
<!DOCTYPE html>
<html>
<head>
<style>
.custom-range {
voice-range: 90Hz;
voice-pitch: 180Hz;
}
</style>
</head>
<body>
<p class="custom-range">This text uses a 90Hz pitch range with a base pitch of 180Hz.</p>
</body>
</html>
The speech synthesizer will use a 90Hz range around the 180Hz base pitch when reading this paragraph, creating a controlled pitch variation.
Conclusion
The voice-range property enhances accessibility by allowing fine control over speech synthesis pitch variation. Use keyword values for general control or frequency values for precise adjustment of how expressive the synthesized voice sounds.
Updated on: 2026-03-15T13:35:17+05:30
174 Views
Advertisements