.dcss-scale-sqrt

Maps a value from a domain to a range through a square root, the usual scale for circle areas.

Example

Result
Markup
<link rel="stylesheet" href="dcss.css">
<link rel="stylesheet" href="families/scale.css">
<link rel="stylesheet" href="families/format.css">

<div class="dcss-scale-sqrt" style="--domain-0: 0; --domain-1: 1; --range-0: 0; --range-1: 1; --value: 0.5">
  <output class="dcss-format-fixed" style="--value: var(--dcss-scale-sqrt); --precision: 4"></output>
</div>

Browser support

BrowserSupport
ChromeYes
SafariYes
FirefoxWhole numbers only

See also