baseFrequency

You’re reading the English version of this content since no translation exists yet for this locale. Help us translate this article!

The baseFrequency attribute represents the base frequency parameter for the noise function of the <feTurbulence> filter primitive.

Only one element is using this attribute: <feTurbulence>

<svg viewBox="0 0 420 200" xmlns="http://www.w3.org/2000/svg">
  <filter id="noise1" x="0" y="0" width="100%" height="100%">
    <feTurbulence baseFrequency="0.025" />
  </filter>
  <filter id="noise2" x="0" y="0" width="100%" height="100%">
    <feTurbulence baseFrequency="0.05" />
  </filter>

  <rect x="0" y="0" width="200" height="200" style="filter: url(#noise1);" />
  <rect x="0" y="0" width="200" height="200" style="filter: url(#noise2); transform: translateX(220px);" />
</svg>

Usage notes

Value <number-optional-number>
Default value 0
Animatable Yes
<number-optional-number>

If two numbers are provided, the first one represents the base frequency in the horizontal direction and the second one the base frequency in the vertical direction. If one number is provided, then that value is used for both x and y.

Negative values are forbidden.

Example

<svg width="200" height="200" viewBox="0 0 220 220"
     xmlns="http://www.w3.org/2000/svg">
  <filter id="displacementFilter">
    <feTurbulence type="turbulence" baseFrequency="0.05"
        numOctaves="2" result="turbulence"/>
    <feDisplacementMap in2="turbulence" in="SourceGraphic"
        scale="50" xChannelSelector="R" yChannelSelector="G"/>
  </filter>

  <circle cx="100" cy="100" r="100"
      style="filter: url(#displacementFilter)"/>
</svg>

Specifications

Specification Status Comment
Filter Effects Module Level 1
The definition of 'baseFrequency' in that specification.
Working Draft No change
Scalable Vector Graphics (SVG) 1.1 (Second Edition)
The definition of 'baseFrequency' in that specification.
Recommendation Initial definition

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
baseFrequencyChrome Full support YesEdge Full support Yes
Notes
Full support Yes
Notes
Notes Partially supported, see bug 12382004.
Firefox Full support 4IE Full support Yes
Notes
Full support Yes
Notes
Notes Partially supported, see bug 12382004.
Opera Full support 9Safari ? WebView Android Full support YesChrome Android Full support YesFirefox Android Full support YesOpera Android Full support YesSafari iOS ? Samsung Internet Android Full support Yes

Legend

Full support  
Full support
Compatibility unknown  
Compatibility unknown
See implementation notes.
See implementation notes.