General

mixins

display

@mixin display($context, $default, $value) { ... }

Description

Cell Atom - Display property

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$context

The desired context/condition

Listnone
$default

The default value to use when the context is not met

Anynone
$value

The value to use when the context is met

Anynone

Requires

position

@mixin position($context, $default, $value) { ... }

Description

Cell Atom - Position property

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$context

The desired context/condition

Listnone
$default

The default value to use when the context is not met

Anynone
$value

The value to use when the context is met

Anynone

Requires

visibility

@mixin visibility($context, $default, $value) { ... }

Description

Cell Atom - Visibility property

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$context

The desired context/condition

Listnone
$default

The default value to use when the context is not met

Anynone
$value

The value to use when the context is met

Anynone

Requires

component

@mixin component($components, $content, $sub-component, $glue, $cascade) { ... }

Description

Create a component based off the main module

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$components

The component or components to be used

String or Listnone
$contentnoneMapnone
$sub-componentnoneBoolnone
$gluenoneStringnone
$cascadenoneBoolnone

Content

This mixin allows extra content to be passed (through the @content directive).

Requires

Used by

sub-component

@mixin sub-component($components, $content, $glue) { ... }

Description

Alis for component mixin with $sub-component: true

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$componentsnoneString or Listnone
$contentnoneMapnone
$gluenoneStringnone

Content

This mixin allows extra content to be passed (through the @content directive).

Requires

Used by

components

@mixin components() { ... }

Description

Alias for component() mixin

Parameters

None.

Content

This mixin allows extra content to be passed (through the @content directive).

Requires

Author

context

@mixin context($context...) { ... }

Description

Apply styles to a component within a certain context

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$contextnoneArglistnone

Content

This mixin allows extra content to be passed (through the @content directive).

Requires

Used by

extend

@mixin extend($modifiers: null, $parent: null, $core: false) { ... }

Description

Extend one or more modifiers of a module to create a new modifier combining the ones you pass

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$modifiers

The modifiers which you wish to combine

String or Listnull
$parent

The parent module if not current one

Stringnull
$core

Extend the core '.module' styles?

Boolfalse

Used by

modifier

@mixin modifier($modifiers, $special: null, $glue: '--', $module) { ... }

Description

Create a modifier for a module

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$modifiers

The modifier(s) which you wish to create

String or Listnone
$special

Add special contextual options to modifier

Stringnull
$glue

Desired modifier separator/glue

Bool'--'
$modulenoneStringnone

Content

This mixin allows extra content to be passed (through the @content directive).

Used by

modifiers

@mixin modifiers() { ... }

Description

Alias for modifier() mixin

Parameters

None.

Content

This mixin allows extra content to be passed (through the @content directive).

Requires

is

@mixin is() { ... }

Description

Alias for modifier() mixin

Parameters

None.

Content

This mixin allows extra content to be passed (through the @content directive).

Requires

module

@mixin module($modules, $content) { ... }

Description

Create a new module

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$modules

The module(s) you wish to create

String or Listnone
$contentnoneMapnone

Content

This mixin allows extra content to be passed (through the @content directive).

Requires

Used by

module-content

@mixin module-content($module, $config, $target) { ... }

Description

Render a module's content

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$modulenoneString or Listnone
$confignoneMapnone
$targetnoneAnynone

Requires

Used by

modules

@mixin modules($modules) { ... }

Description

Alias for module() mixin

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$modules

The module(s) you wish to create

String or Listnone

Content

This mixin allows extra content to be passed (through the @content directive).

Requires

combine-modifiers

@mixin combine-modifiers($styles) { ... }

Description

Combine modifiers into a new, single modifier

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$styles

The CSS styles to output

Mapnone

Requires

Used by

extend-modifiers

@mixin extend-modifiers($styles) { ... }

Description

Extend modifiers into the naked module

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$styles

The CSS styles to output

Mapnone

Requires

Used by

option

@mixin option($option-path...) { ... }

Description

Apply styles to a module if a passed option returns true

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$option-path

The option which you wish to test against

Arglistnone

Content

This mixin allows extra content to be passed (through the @content directive).

Requires

pseudo-state

@mixin pseudo-state($state) { ... }

Description

Used to generate selectors for pseudo states

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$statenoneStringnone

Content

This mixin allows extra content to be passed (through the @content directive).

Used by

hover

@mixin hover() { ... }

Description

Alias for pseudo-state mixin with $state: 'hover'

Parameters

None.

Content

This mixin allows extra content to be passed (through the @content directive).

Requires

value

@mixin value($value) { ... }

Description

Apply styles when a defined option is a particular value

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$value

The value you wish to apply styles to

none

Content

This mixin allows extra content to be passed (through the @content directive).

Requires

wrapper

@mixin wrapper($namespace, $scope) { ... }

Description

Wrap a module or group a collection of modules

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$namespacenoneStringnone
$scopenoneStringnone

Content

This mixin allows extra content to be passed (through the @content directive).

Requires

Used by

group

@mixin group() { ... }

Description

Alias for wrapper() mixin

Parameters

None.

Content

This mixin allows extra content to be passed (through the @content directive).

Requires

parse-cq

@mixin parse-cq($map, $sub-component, $prevContext) { ... }

Description

Parse CQ

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$map

The map from which to parse CQ

Mapnone
$sub-componentnoneBoolnone
$prevContextnoneBoolnone

Requires

Used by

functions

create-config

@function create-config($map-old, $map-new, $parser) { ... }

Description

Used to merge a module's default configuration with any custom values passed to the module

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$map-old

The map which holds default configuration

Mapnone
$map-new

The map which holds custom values

Mapnone
$parser

Custom parser to use for configuration

Stringnone

Requires

eval-config

@function eval-config() { ... }

Description

Evaluate properties from function-calls

Parameters

None.

Used by

smart-config

@function smart-config() { ... }

Description

Convert configuration keys such as component(item) into the paramater name, i.e. item, so they can be retreived with this()

Parameters

None.

Requires

Used by

create-selector-from-context

@function create-selector-from-context($block, $context, $pipeContexts) { ... }

Description

Used to create a selector from context() arguments

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$block

The name of the module/component that has the context

(string or List)none
$context

The context you wish to test

Stringnone
$pipeContextsnoneBoolnone

Requires

Used by

generate-chunk

@function generate-chunk($block) { ... }

Description

Generate a selector chunk from a $block list

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$blocknone(string or List)none

Used by

enabled

@function enabled($option) { ... }

Description

Return a CSS property if the passed option is enabled

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$option

the desired option

String or Listnone

Returns

Any type —

$true-value if option enabled, otherwise returns $false-value

Requires

get-module-name

@function get-module-name($namespace) { ... }

Description

Get the name of a module from a namespace

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$namespacenoneStringnone

Used by

get-param

@function get-param($source) { ... }

Description

Get parmater from config string

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$source

the string from which to retrieve param

Stringnone

Requires

Used by

merge-css-maps

@function merge-css-maps($source, $target) { ... }

Description

Merge maps containing module/component CSS

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$sourcenoneMapnone
$targetnoneMapnone

Requires

module-tree

@function module-tree($selector) { ... }

Description

Create a namespace tree from a passed selector

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$selector

The selector from which to create the module tree

Listnone

Requires

Used by

option

@function option() { ... }

Description

Return the value of a module's option

Parameters

None.

Used by

remove-junk

@function remove-junk($query) { ... }

Description

Remove junk characters from a selector string

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$querynoneStringnone

Used by

remove-modifiers

@function remove-modifiers($selector) { ... }

Description

Remove modifiers from a selector

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$selector

The selector from which to remove modifiers

Listnone

Used by

selector-to-map

@function selector-to-map($selector) { ... }

Description

Convert a selector into a map of modules, components and modifiers

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$selectornoneStringnone

Requires

Used by

setting

@function setting($map, $keys...) { ... }

Description

Alias function to option()

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$mapnoneMapnone
$keysnoneArglistnone

Requires

strip-glue

@function strip-glue($string, $glue) { ... }

Description

Strip the glue (-- , __) from a string

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$stringnoneStringnone
$gluenoneStringnone

Used by

theme

@function theme($args...) { ... }

Description

Get a value from $theme if it exists

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$argsnoneArglistnone

this

@function this($options...) { ... }

Description

Get a value from the current module's configuration

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$optionsnoneArglistnone

Requires

value-enabled

@function value-enabled($value) { ... }

Description

Determine if a passed value should be considered 'enabled'

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$value

the value to check

Anynone

Returns

Any type —

whether or not the option is enabled

Used by

variables

css-properties

$css-properties: (
  'accelerator',
  '-wap-accesskey',
  'align-content',
  '-webkit-align-content',
  'align-items',
  '-webkit-align-items',
  'align-self',
  '-webkit-align-self',
  'alignment-baseline',
  'all',
  'alt',
  '-webkit-alt',
  'animation',
  'animation-delay',
  '-moz-animation-delay',
  '-ms-animation-delay',
  '-webkit-animation-delay',
  'animation-direction',
  '-moz-animation-direction',
  '-ms-animation-direction',
  '-webkit-animation-direction',
  'animation-duration',
  '-moz-animation-duration',
  '-ms-animation-duration',
  '-webkit-animation-duration',
  'animation-fill-mode',
  '-moz-animation-fill-mode',
  '-ms-animation-fill-mode',
  '-webkit-animation-fill-mode',
  'animation-iteration-count',
  '-moz-animation-iteration-count',
  '-ms-animation-iteration-count',
  '-webkit-animation-iteration-count',
  '-moz-animation',
  '-ms-animation',
  'animation-name',
  '-moz-animation-name',
  '-ms-animation-name',
  '-webkit-animation-name',
  'animation-play-state',
  '-moz-animation-play-state',
  '-ms-animation-play-state',
  '-webkit-animation-play-state',
  'animation-timing-function',
  '-moz-animation-timing-function',
  '-ms-animation-timing-function',
  '-webkit-animation-timing-function',
  '-webkit-animation',
  '-webkit-app-region',
  'appearance',
  '-moz-appearance',
  '-webkit-appearance',
  '-webkit-aspect-ratio',
  'audio-level',
  'azimuth',
  'backdrop-filter',
  '-webkit-backdrop-filter',
  'backface-visibility',
  '-moz-backface-visibility',
  '-ms-backface-visibility',
  '-webkit-backface-visibility',
  'background',
  'background-attachment',
  '-webkit-background-attachment',
  'background-blend-mode',
  'background-clip',
  '-moz-background-clip',
  '-webkit-background-clip',
  'background-color',
  '-webkit-background-color',
  '-webkit-background-composite',
  'background-image',
  'background-image-transform',
  '-webkit-background-image',
  '-moz-background-inline-policy',
  'background-origin',
  '-moz-background-origin',
  '-webkit-background-origin',
  'background-position',
  '-webkit-background-position',
  'background-position-x',
  '-webkit-background-position-x',
  'background-position-y',
  '-webkit-background-position-y',
  'background-repeat',
  '-webkit-background-repeat',
  'background-repeat-x',
  'background-repeat-y',
  'background-size',
  '-moz-background-size',
  '-webkit-background-size',
  '-webkit-background',
  'baseline-shift',
  'behavior',
  '-moz-binding',
  '-ms-block-progression',
  'block-size',
  'block-step',
  'block-step-align',
  'block-step-insert',
  'block-step-round',
  'block-step-size',
  'bookmark-label',
  'bookmark-level',
  'bookmark-state',
  'border',
  '-webkit-border-after-color',
  '-webkit-border-after-style',
  '-webkit-border-after',
  '-webkit-border-after-width',
  '-webkit-border-before-color',
  '-webkit-border-before-style',
  '-webkit-border-before',
  '-webkit-border-before-width',
  'border-block',
  'border-block-color',
  'border-block-end',
  'border-block-end-color',
  'border-block-end-style',
  'border-block-end-width',
  'border-block-start',
  'border-block-start-color',
  'border-block-start-style',
  'border-block-start-width',
  'border-block-style',
  'border-block-width',
  'border-bottom',
  'border-bottom-color',
  '-moz-border-bottom-colors',
  'border-bottom-left-radius',
  '-webkit-border-bottom-left-radius',
  'border-bottom-right-radius',
  '-webkit-border-bottom-right-radius',
  'border-bottom-style',
  'border-bottom-width',
  'border-boundary',
  'border-collapse',
  'border-color',
  '-moz-border-end-color',
  '-webkit-border-end-color',
  '-moz-border-end',
  '-moz-border-end-style',
  '-webkit-border-end-style',
  '-webkit-border-end',
  '-moz-border-end-width',
  '-webkit-border-end-width',
  '-webkit-border-fit',
  '-webkit-border-horizontal-spacing',
  'border-image',
  '-moz-border-image',
  '-o-border-image',
  'border-image-outset',
  '-webkit-border-image-outset',
  'border-image-repeat',
  '-webkit-border-image-repeat',
  'border-image-slice',
  '-webkit-border-image-slice',
  'border-image-source',
  '-webkit-border-image-source',
  'border-image-transform',
  '-webkit-border-image',
  'border-image-width',
  '-webkit-border-image-width',
  'border-inline',
  'border-inline-color',
  'border-inline-end',
  'border-inline-end-color',
  'border-inline-end-style',
  'border-inline-end-width',
  'border-inline-start',
  'border-inline-start-color',
  'border-inline-start-style',
  'border-inline-start-width',
  'border-inline-style',
  'border-inline-width',
  'border-left',
  'border-left-color',
  '-moz-border-left-colors',
  'border-left-style',
  'border-left-width',
  'border-radius',
  '-moz-border-radius-bottomleft',
  '-moz-border-radius-bottomright',
  '-moz-border-radius',
  '-moz-border-radius-topleft',
  '-moz-border-radius-topright',
  '-webkit-border-radius',
  'border-right',
  'border-right-color',
  '-moz-border-right-colors',
  'border-right-style',
  'border-right-width',
  'border-spacing',
  '-moz-border-start-color',
  '-webkit-border-start-color',
  '-moz-border-start',
  '-moz-border-start-style',
  '-webkit-border-start-style',
  '-webkit-border-start',
  '-moz-border-start-width',
  '-webkit-border-start-width',
  'border-style',
  'border-top',
  'border-top-color',
  '-moz-border-top-colors',
  'border-top-left-radius',
  '-webkit-border-top-left-radius',
  'border-top-right-radius',
  '-webkit-border-top-right-radius',
  'border-top-style',
  'border-top-width',
  '-webkit-border-vertical-spacing',
  'border-width',
  'bottom',
  '-moz-box-align',
  '-webkit-box-align',
  'box-decoration-break',
  '-webkit-box-decoration-break',
  '-moz-box-direction',
  '-webkit-box-direction',
  '-webkit-box-flex-group',
  '-moz-box-flex',
  '-webkit-box-flex',
  '-webkit-box-lines',
  '-moz-box-ordinal-group',
  '-webkit-box-ordinal-group',
  '-moz-box-orient',
  '-webkit-box-orient',
  '-moz-box-pack',
  '-webkit-box-pack',
  '-webkit-box-reflect',
  'box-shadow',
  '-moz-box-shadow',
  '-webkit-box-shadow',
  'box-sizing',
  '-moz-box-sizing',
  '-webkit-box-sizing',
  'box-snap',
  'break-after',
  'break-before',
  'break-inside',
  'buffered-rendering',
  'caption-side',
  'caret',
  'caret-animation',
  'caret-color',
  'caret-shape',
  'chains',
  'clear',
  'clip',
  'clip-path',
  '-webkit-clip-path',
  'clip-rule',
  'color',
  'color-adjust',
  '-webkit-color-correction',
  'color-interpolation',
  'color-interpolation-filters',
  'color-profile',
  'color-rendering',
  '-webkit-column-axis',
  '-webkit-column-break-after',
  '-webkit-column-break-before',
  '-webkit-column-break-inside',
  'column-count',
  '-moz-column-count',
  '-webkit-column-count',
  'column-fill',
  '-moz-column-fill',
  '-webkit-column-fill',
  'column-gap',
  '-moz-column-gap',
  '-webkit-column-gap',
  'column-progression',
  '-webkit-column-progression',
  'column-rule',
  'column-rule-color',
  '-moz-column-rule-color',
  '-webkit-column-rule-color',
  '-moz-column-rule',
  'column-rule-style',
  '-moz-column-rule-style',
  '-webkit-column-rule-style',
  '-webkit-column-rule',
  'column-rule-width',
  '-moz-column-rule-width',
  '-webkit-column-rule-width',
  'column-span',
  '-webkit-column-span',
  'column-width',
  '-moz-column-width',
  '-webkit-column-width',
  'columns',
  '-moz-columns',
  '-webkit-columns',
  '-webkit-composition-fill-color',
  '-webkit-composition-frame-color',
  'contain',
  'content',
  '-ms-content-zoom-chaining',
  '-ms-content-zoom-limit-max',
  '-ms-content-zoom-limit-min',
  '-ms-content-zoom-limit',
  '-ms-content-zoom-snap',
  '-ms-content-zoom-snap-points',
  '-ms-content-zoom-snap-type',
  '-ms-content-zooming',
  'continue',
  'counter-increment',
  'counter-reset',
  'counter-set',
  'cue',
  'cue-after',
  'cue-before',
  'cursor',
  '-webkit-cursor-visibility',
  'cx',
  'cy',
  'd',
  '-apple-dashboard-region',
  '-webkit-dashboard-region',
  'direction',
  'display',
  'display-align',
  'dominant-baseline',
  'elevation',
  'empty-cells',
  'enable-background',
  'fill',
  'fill-break',
  'fill-color',
  'fill-image',
  'fill-opacity',
  'fill-origin',
  'fill-position',
  'fill-repeat',
  'fill-rule',
  'fill-size',
  'filter',
  '-ms-filter',
  '-webkit-filter',
  'flex',
  '-ms-flex-align',
  '-webkit-flex-align',
  'flex-basis',
  '-webkit-flex-basis',
  'flex-direction',
  '-ms-flex-direction',
  '-webkit-flex-direction',
  'flex-flow',
  '-ms-flex-flow',
  '-webkit-flex-flow',
  'flex-grow',
  '-webkit-flex-grow',
  '-ms-flex-item-align',
  '-webkit-flex-item-align',
  '-ms-flex-line-pack',
  '-webkit-flex-line-pack',
  '-ms-flex',
  '-ms-flex-negative',
  '-ms-flex-order',
  '-webkit-flex-order',
  '-ms-flex-pack',
  '-webkit-flex-pack',
  '-ms-flex-positive',
  '-ms-flex-preferred-size',
  'flex-shrink',
  '-webkit-flex-shrink',
  '-webkit-flex',
  'flex-wrap',
  '-ms-flex-wrap',
  '-webkit-flex-wrap',
  'float',
  'float-defer',
  '-moz-float-edge',
  'float-offset',
  'float-reference',
  'flood-color',
  'flood-opacity',
  'flow',
  'flow-from',
  '-ms-flow-from',
  '-webkit-flow-from',
  'flow-into',
  '-ms-flow-into',
  '-webkit-flow-into',
  'font',
  'font-display',
  'font-family',
  'font-feature-settings',
  '-moz-font-feature-settings',
  '-ms-font-feature-settings',
  '-webkit-font-feature-settings',
  'font-kerning',
  '-webkit-font-kerning',
  'font-language-override',
  '-moz-font-language-override',
  'font-max-size',
  'font-min-size',
  'font-optical-sizing',
  'font-palette',
  'font-presentation',
  'font-size',
  'font-size-adjust',
  '-webkit-font-size-delta',
  '-webkit-font-smoothing',
  'font-stretch',
  'font-style',
  'font-synthesis',
  'font-variant',
  'font-variant-alternates',
  'font-variant-caps',
  'font-variant-east-asian',
  'font-variant-ligatures',
  '-webkit-font-variant-ligatures',
  'font-variant-numeric',
  'font-variant-position',
  'font-variation-settings',
  'font-weight',
  'footnote-display',
  'footnote-policy',
  '-moz-force-broken-image-icon',
  'glyph-orientation-horizontal',
  'glyph-orientation-vertical',
  'grid',
  '-webkit-grid-after',
  'grid-area',
  'grid-auto-columns',
  '-webkit-grid-auto-columns',
  'grid-auto-flow',
  '-webkit-grid-auto-flow',
  'grid-auto-rows',
  '-webkit-grid-auto-rows',
  '-webkit-grid-before',
  'grid-column',
  '-ms-grid-column-align',
  'grid-column-end',
  'grid-column-gap',
  '-ms-grid-column',
  '-ms-grid-column-span',
  'grid-column-start',
  '-webkit-grid-column',
  '-ms-grid-columns',
  '-webkit-grid-columns',
  '-webkit-grid-end',
  'grid-gap',
  'grid-row',
  '-ms-grid-row-align',
  'grid-row-end',
  'grid-row-gap',
  '-ms-grid-row',
  '-ms-grid-row-span',
  'grid-row-start',
  '-webkit-grid-row',
  '-ms-grid-rows',
  '-webkit-grid-rows',
  '-webkit-grid-start',
  'grid-template',
  'grid-template-areas',
  'grid-template-columns',
  'grid-template-rows',
  'hanging-punctuation',
  'height',
  '-ms-high-contrast-adjust',
  '-webkit-highlight',
  'hyphenate-character',
  '-webkit-hyphenate-character',
  '-webkit-hyphenate-limit-after',
  '-webkit-hyphenate-limit-before',
  'hyphenate-limit-chars',
  '-ms-hyphenate-limit-chars',
  'hyphenate-limit-last',
  'hyphenate-limit-lines',
  '-ms-hyphenate-limit-lines',
  '-webkit-hyphenate-limit-lines',
  'hyphenate-limit-zone',
  '-ms-hyphenate-limit-zone',
  'hyphens',
  '-moz-hyphens',
  '-ms-hyphens',
  '-webkit-hyphens',
  'image-orientation',
  '-moz-image-region',
  'image-rendering',
  'image-resolution',
  '-ms-ime-align',
  'ime-mode',
  'initial-letter',
  'initial-letter-align',
  '-webkit-initial-letter',
  'initial-letter-wrap',
  'inline-size',
  'input-format',
  '-wap-input-format',
  '-wap-input-required',
  'inset',
  'inset-block',
  'inset-block-end',
  'inset-block-start',
  'inset-inline',
  'inset-inline-end',
  'inset-inline-start',
  '-ms-interpolation-mode',
  'isolation',
  'justify-content',
  '-webkit-justify-content',
  'justify-items',
  'justify-self',
  '-webkit-justify-self',
  'kerning',
  'layout-flow',
  'layout-grid',
  'layout-grid-char',
  'layout-grid-line',
  'layout-grid-mode',
  'layout-grid-type',
  'left',
  'letter-spacing',
  'lighting-color',
  '-webkit-line-align',
  '-webkit-line-box-contain',
  'line-break',
  '-webkit-line-break',
  '-webkit-line-clamp',
  'line-grid',
  '-webkit-line-grid-snap',
  '-webkit-line-grid',
  'line-height',
  'line-height-step',
  'line-increment',
  'line-snap',
  '-webkit-line-snap',
  '-o-link',
  '-o-link-source',
  'list-style',
  'list-style-image',
  'list-style-position',
  'list-style-type',
  '-webkit-locale',
  '-webkit-logical-height',
  '-webkit-logical-width',
  'margin',
  '-webkit-margin-after-collapse',
  '-webkit-margin-after',
  '-webkit-margin-before-collapse',
  '-webkit-margin-before',
  'margin-block',
  'margin-block-end',
  'margin-block-start',
  'margin-bottom',
  '-webkit-margin-bottom-collapse',
  '-webkit-margin-collapse',
  '-moz-margin-end',
  '-webkit-margin-end',
  'margin-inline',
  'margin-inline-end',
  'margin-inline-start',
  'margin-left',
  'margin-right',
  '-moz-margin-start',
  '-webkit-margin-start',
  'margin-top',
  '-webkit-margin-top-collapse',
  'marker',
  'marker-end',
  'marker-knockout-left',
  'marker-knockout-right',
  'marker-mid',
  'marker-offset',
  'marker-pattern',
  'marker-segment',
  'marker-side',
  'marker-start',
  'marks',
  '-wap-marquee-dir',
  'marquee-direction',
  '-webkit-marquee-direction',
  '-webkit-marquee-increment',
  'marquee-loop',
  '-wap-marquee-loop',
  '-webkit-marquee-repetition',
  'marquee-speed',
  '-wap-marquee-speed',
  '-webkit-marquee-speed',
  'marquee-style',
  '-wap-marquee-style',
  '-webkit-marquee-style',
  '-webkit-marquee',
  'mask',
  '-webkit-mask-attachment',
  'mask-border',
  'mask-border-mode',
  'mask-border-outset',
  'mask-border-repeat',
  'mask-border-slice',
  'mask-border-source',
  'mask-border-width',
  '-webkit-mask-box-image-outset',
  '-webkit-mask-box-image-repeat',
  '-webkit-mask-box-image-slice',
  '-webkit-mask-box-image-source',
  '-webkit-mask-box-image',
  '-webkit-mask-box-image-width',
  'mask-clip',
  '-webkit-mask-clip',
  'mask-composite',
  '-webkit-mask-composite',
  'mask-image',
  '-webkit-mask-image',
  'mask-mode',
  'mask-origin',
  '-webkit-mask-origin',
  'mask-position',
  '-webkit-mask-position',
  'mask-position-x',
  '-webkit-mask-position-x',
  'mask-position-y',
  '-webkit-mask-position-y',
  'mask-repeat',
  '-webkit-mask-repeat',
  '-webkit-mask-repeat-x',
  '-webkit-mask-repeat-y',
  'mask-size',
  '-webkit-mask-size',
  'mask-source-type',
  '-webkit-mask-source-type',
  'mask-type',
  '-webkit-mask',
  '-webkit-match-nearest-mail-blockquote-color',
  'max-block-size',
  'max-height',
  'max-inline-size',
  'max-lines',
  '-webkit-max-logical-height',
  '-webkit-max-logical-width',
  'max-width',
  'max-zoom',
  'min-block-size',
  'min-height',
  'min-inline-size',
  '-webkit-min-logical-height',
  '-webkit-min-logical-width',
  'min-width',
  'min-zoom',
  'mix-blend-mode',
  'motion',
  'motion-offset',
  'motion-path',
  'motion-rotation',
  'nav-down',
  'nav-index',
  'nav-left',
  'nav-right',
  'nav-up',
  '-webkit-nbsp-mode',
  'object-fit',
  '-o-object-fit',
  'object-position',
  '-o-object-position',
  'offset',
  'offset-after',
  'offset-anchor',
  'offset-before',
  'offset-block-end',
  'offset-block-start',
  'offset-distance',
  'offset-end',
  'offset-inline-end',
  'offset-inline-start',
  'offset-path',
  'offset-position',
  'offset-rotate',
  'offset-rotation',
  'offset-start',
  'opacity',
  '-moz-opacity',
  'order',
  '-webkit-order',
  '-moz-orient',
  'orientation',
  'orphans',
  '-moz-osx-font-smoothing',
  'outline',
  'outline-color',
  '-moz-outline-color',
  '-moz-outline',
  'outline-offset',
  '-moz-outline-offset',
  '-moz-outline-radius-bottomleft',
  '-moz-outline-radius-bottomright',
  '-moz-outline-radius',
  '-moz-outline-radius-topleft',
  '-moz-outline-radius-topright',
  'outline-style',
  '-moz-outline-style',
  'outline-width',
  '-moz-outline-width',
  'overflow',
  'overflow-anchor',
  '-webkit-overflow-scrolling',
  'overflow-style',
  '-ms-overflow-style',
  'overflow-wrap',
  'overflow-x',
  'overflow-y',
  'padding',
  '-webkit-padding-after',
  '-webkit-padding-before',
  'padding-block',
  'padding-block-end',
  'padding-block-start',
  'padding-bottom',
  '-moz-padding-end',
  '-webkit-padding-end',
  'padding-inline',
  'padding-inline-end',
  'padding-inline-start',
  'padding-left',
  'padding-right',
  '-moz-padding-start',
  '-webkit-padding-start',
  'padding-top',
  'page',
  'page-break-after',
  'page-break-before',
  'page-break-inside',
  'paint-order',
  'pause',
  'pause-after',
  'pause-before',
  'perspective',
  '-moz-perspective',
  '-ms-perspective',
  'perspective-origin',
  '-moz-perspective-origin',
  '-ms-perspective-origin',
  '-webkit-perspective-origin',
  'perspective-origin-x',
  '-webkit-perspective-origin-x',
  'perspective-origin-y',
  '-webkit-perspective-origin-y',
  '-webkit-perspective',
  'pitch',
  'pitch-range',
  'place-content',
  'place-items',
  'place-self',
  'play-during',
  'pointer-events',
  'position',
  '-webkit-print-color-adjust',
  'quotes',
  'r',
  '-webkit-region-break-after',
  '-webkit-region-break-before',
  '-webkit-region-break-inside',
  'region-fragment',
  '-webkit-region-fragment',
  '-webkit-region-overflow',
  'resize',
  'rest',
  'rest-after',
  'rest-before',
  'richness',
  'right',
  'rotate',
  'rotation',
  'rotation-point',
  '-webkit-rtl-ordering',
  'ruby-align',
  'ruby-merge',
  'ruby-overhang',
  'ruby-position',
  '-webkit-ruby-position',
  'running',
  'rx',
  'ry',
  'scale',
  'scroll-behavior',
  '-ms-scroll-chaining',
  '-ms-scroll-limit',
  '-ms-scroll-limit-x-max',
  '-ms-scroll-limit-x-min',
  '-ms-scroll-limit-y-max',
  '-ms-scroll-limit-y-min',
  'scroll-padding',
  'scroll-padding-block',
  'scroll-padding-block-end',
  'scroll-padding-block-start',
  'scroll-padding-bottom',
  'scroll-padding-inline',
  'scroll-padding-inline-end',
  'scroll-padding-inline-start',
  'scroll-padding-left',
  'scroll-padding-right',
  'scroll-padding-top',
  '-ms-scroll-rails',
  'scroll-snap-align',
  'scroll-snap-coordinate',
  '-webkit-scroll-snap-coordinate',
  'scroll-snap-destination',
  '-webkit-scroll-snap-destination',
  'scroll-snap-margin',
  'scroll-snap-margin-block',
  'scroll-snap-margin-block-end',
  'scroll-snap-margin-block-start',
  'scroll-snap-margin-bottom',
  'scroll-snap-margin-inline',
  'scroll-snap-margin-inline-end',
  'scroll-snap-margin-inline-start',
  'scroll-snap-margin-left',
  'scroll-snap-margin-right',
  'scroll-snap-margin-top',
  'scroll-snap-points-x',
  '-ms-scroll-snap-points-x',
  '-webkit-scroll-snap-points-x',
  'scroll-snap-points-y',
  '-ms-scroll-snap-points-y',
  '-webkit-scroll-snap-points-y',
  'scroll-snap-stop',
  'scroll-snap-type',
  '-ms-scroll-snap-type',
  '-webkit-scroll-snap-type',
  'scroll-snap-type-x',
  'scroll-snap-type-y',
  '-ms-scroll-snap-x',
  '-ms-scroll-snap-y',
  '-ms-scroll-translation',
  'scrollbar-arrow-color',
  'scrollbar-base-color',
  'scrollbar-dark-shadow-color',
  'scrollbar-darkshadow-color',
  'scrollbar-face-color',
  'scrollbar-gutter',
  'scrollbar-highlight-color',
  'scrollbar-shadow-color',
  'scrollbar-track-color',
  'scrollbar3d-light-color',
  'scrollbar3dlight-color',
  'shape-image-threshold',
  '-webkit-shape-image-threshold',
  'shape-inside',
  '-webkit-shape-inside',
  'shape-margin',
  '-webkit-shape-margin',
  'shape-outside',
  '-webkit-shape-outside',
  '-webkit-shape-padding',
  'shape-rendering',
  'size',
  'snap-height',
  'solid-color',
  'solid-opacity',
  'speak',
  'speak-as',
  'speak-header',
  'speak-numeral',
  'speak-punctuation',
  'speech-rate',
  'src',
  '-moz-stack-sizing',
  'stop-color',
  'stop-opacity',
  'stress',
  'string-set',
  'stroke',
  'stroke-align',
  'stroke-alignment',
  'stroke-break',
  'stroke-color',
  'stroke-dash-corner',
  'stroke-dash-justify',
  'stroke-dashadjust',
  'stroke-dasharray',
  'stroke-dashcorner',
  'stroke-dashoffset',
  'stroke-image',
  'stroke-linecap',
  'stroke-linejoin',
  'stroke-miterlimit',
  'stroke-opacity',
  'stroke-origin',
  'stroke-position',
  'stroke-repeat',
  'stroke-size',
  'stroke-width',
  '-webkit-svg-shadow',
  'tab-size',
  '-moz-tab-size',
  '-o-tab-size',
  '-o-table-baseline',
  'table-layout',
  '-webkit-tap-highlight-color',
  'text-align',
  'text-align-all',
  'text-align-last',
  '-moz-text-align-last',
  'text-anchor',
  'text-autospace',
  '-moz-text-blink',
  '-ms-text-combine-horizontal',
  'text-combine-upright',
  '-webkit-text-combine',
  'text-decoration',
  'text-decoration-blink',
  'text-decoration-color',
  '-moz-text-decoration-color',
  '-webkit-text-decoration-color',
  'text-decoration-line',
  '-moz-text-decoration-line',
  'text-decoration-line-through',
  '-webkit-text-decoration-line',
  'text-decoration-none',
  'text-decoration-overline',
  'text-decoration-skip',
  '-webkit-text-decoration-skip',
  'text-decoration-style',
  '-moz-text-decoration-style',
  '-webkit-text-decoration-style',
  'text-decoration-underline',
  '-webkit-text-decoration',
  '-webkit-text-decorations-in-effect',
  'text-emphasis',
  'text-emphasis-color',
  '-webkit-text-emphasis-color',
  'text-emphasis-position',
  '-webkit-text-emphasis-position',
  'text-emphasis-style',
  '-webkit-text-emphasis-style',
  '-webkit-text-emphasis',
  '-webkit-text-fill-color',
  'text-indent',
  'text-justify',
  'text-justify-trim',
  'text-kashida',
  'text-kashida-space',
  'text-line-through',
  'text-line-through-color',
  'text-line-through-mode',
  'text-line-through-style',
  'text-line-through-width',
  'text-orientation',
  '-webkit-text-orientation',
  'text-overflow',
  'text-overline',
  'text-overline-color',
  'text-overline-mode',
  'text-overline-style',
  'text-overline-width',
  'text-rendering',
  '-webkit-text-security',
  'text-shadow',
  'text-size-adjust',
  '-moz-text-size-adjust',
  '-ms-text-size-adjust',
  '-webkit-text-size-adjust',
  'text-space-collapse',
  'text-space-trim',
  'text-spacing',
  '-webkit-text-stroke-color',
  '-webkit-text-stroke',
  '-webkit-text-stroke-width',
  'text-transform',
  'text-underline',
  'text-underline-color',
  'text-underline-mode',
  'text-underline-position',
  '-webkit-text-underline-position',
  'text-underline-style',
  'text-underline-width',
  'text-wrap',
  '-webkit-text-zoom',
  'top',
  'touch-action',
  'touch-action-delay',
  '-ms-touch-action',
  '-webkit-touch-callout',
  '-ms-touch-select',
  'transform',
  'transform-box',
  '-moz-transform',
  '-ms-transform',
  '-o-transform',
  'transform-origin',
  '-moz-transform-origin',
  '-ms-transform-origin',
  '-o-transform-origin',
  '-webkit-transform-origin',
  'transform-origin-x',
  '-webkit-transform-origin-x',
  'transform-origin-y',
  '-webkit-transform-origin-y',
  'transform-origin-z',
  '-webkit-transform-origin-z',
  'transform-style',
  '-moz-transform-style',
  '-ms-transform-style',
  '-webkit-transform-style',
  '-webkit-transform',
  'transition',
  'transition-delay',
  '-moz-transition-delay',
  '-ms-transition-delay',
  '-o-transition-delay',
  '-webkit-transition-delay',
  'transition-duration',
  '-moz-transition-duration',
  '-ms-transition-duration',
  '-o-transition-duration',
  '-webkit-transition-duration',
  '-moz-transition',
  '-ms-transition',
  '-o-transition',
  'transition-property',
  '-moz-transition-property',
  '-ms-transition-property',
  '-o-transition-property',
  '-webkit-transition-property',
  'transition-timing-function',
  '-moz-transition-timing-function',
  '-ms-transition-timing-function',
  '-o-transition-timing-function',
  '-webkit-transition-timing-function',
  '-webkit-transition',
  'translate',
  'uc-alt-skin',
  'uc-skin',
  'unicode-bidi',
  'unicode-range',
  '-webkit-user-drag',
  '-moz-user-focus',
  '-moz-user-input',
  '-moz-user-modify',
  '-webkit-user-modify',
  'user-select',
  '-moz-user-select',
  '-ms-user-select',
  '-webkit-user-select',
  'user-zoom',
  'vector-effect',
  'vertical-align',
  'viewport-fill',
  'viewport-fill-opacity',
  'visibility',
  'voice-balance',
  'voice-duration',
  'voice-family',
  'voice-pitch',
  'voice-range',
  'voice-rate',
  'voice-stress',
  'voice-volume',
  'volume',
  'white-space',
  '-webkit-widget-region',
  'widows',
  'width',
  'will-change',
  '-moz-window-dragging',
  '-moz-window-shadow',
  'word-break',
  'word-spacing',
  'word-wrap',
  'wrap-after',
  'wrap-before',
  'wrap-flow',
  '-ms-wrap-flow',
  '-webkit-wrap-flow',
  'wrap-inside',
  '-ms-wrap-margin',
  '-webkit-wrap-margin',
  '-webkit-wrap-padding',
  '-webkit-wrap-shape-inside',
  '-webkit-wrap-shape-outside',
  'wrap-through',
  '-ms-wrap-through',
  '-webkit-wrap-through',
  '-webkit-wrap',
  'writing-mode',
  '-webkit-writing-mode',
  'x',
  'y',
  'z-index',
  'zoom'
) !default;

Description

List of known and valid CSS properties

Type

Map

Used by