<frequency-percentage>

This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The <frequency-percentage> CSS data type represents a value that can be either a <frequency> or a <percentage>. Frequency values, e.g. the pitch of a speaking voice, are not currently used in any CSS properties.

Syntax

The value of a <frequency-percentage> is either a <frequency> or a <percentage>; see their individual reference pages for details about their syntaxes.

Description

Use in calc()

Where a <frequency-percentage> is specified as an allowable type, this means that the percentage resolves to a frequency and therefore can be used in a calc() expression.

Examples

Valid percentage values

90% Positive percentage
+90% Positive percentage with leading +
-90% Negative percentage — not valid for all properties that use percentages

Invalid percentage values

90 % No space is allowed between the number and the unit

Valid frequency values

12Hz     Positive integer
4.3Hz    Non-integer
14KhZ    The unit is case-insensitive, though non-SI capitalization is not recommended.
+0Hz     Zero, with a leading + and a unit
-0kHz    Zero, with a leading - and a unit

Invalid frequency values

12.0     This is a <number>, not an <frequency>, because it is missing a unit.
7 Hz     No space is allowed between the number and the unit.
0        Although unitless zero is an allowable <length>, it's an invalid <frequency>.

Specifications

Specification Status Comment
CSS Values and Units Module Level 4
The definition of '<frequency-percentage>' in that specification.
Editor's Draft
CSS Values and Units Module Level 3
The definition of '<frequency-percentage>' in that specification.
Candidate Recommendation Defines <frequency-percentage>. Adds calc()

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
<frequency-percentage>Chrome No support NoEdge No support NoFirefox No support NoIE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android No support NoOpera Android No support NoSafari iOS No support NoSamsung Internet Android No support No

Legend

No support  
No support

See also