Web/CSS/frequency-percentage

This is an experimental technologyCheck 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 4The definition of '<frequency-percentage>' in that specification.	Editor's Draft
CSS Values and Units Module Level 3The definition of '<frequency-percentage>' in that specification.	Candidate Recommendation	Defines `<frequency-percentage>`. Adds `calc()`

Browser compatibility

Update compatibility data on GitHub

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`<frequency-percentage>`	Chrome No support No	Edge No support No	Firefox No support No	IE No support No	Opera No support No	Safari No support No	WebView Android No support No	Chrome Android No support No	Firefox Android No support No	Opera Android No support No	Safari iOS No support No	Samsung Internet Android No support No

Legend

No support: No support