Boolean
$border-radius-disable-everything: false !default;
Number
$border-radius-none: 0 !default;
Number
$border-radius-xs: 0.25rem !default;
Number
$border-radius-sm: 0.5rem !default;
Number
$border-radius-md: 0.75rem !default;
Number
$border-radius-lg: 1rem !default;
Number
$border-radius-xl: 1.75rem !default;
Number
$border-radius-full: 50% !default;
List
$border-radius-variables: (none, xs, sm, md, lg, xl, full);
mixin
@mixin set-var($name, $value) { … }
mixin
@mixin use-var($property, $name: $property, $fallback: null) { … }
mixin
@mixin variables { … }
function
@function get-var($name, $fallback: null) { … }
String
Set to true
to disable the border radius variables. You probably don't want to do this.
No Border Radius.
Extra Small Border Radius.
Small Border Radius.
Medium Border Radius.
Large Border Radius.
Extra Large Border Radius.
Full Border Radius.
The available configurable css variables and mostly used internally for the
get-var
, set-var
, and use-var
utils.
The supported variable name
The value to set the variable to. Supports null
which will just be a no-op.
The css property to apply the variable to
The supported variable name
An optional fallback value if the variable has not been set
Conditionally applies the css variables based on feature flags
a var()
statement
The supported variable name
An optional fallback value