# MultiInlineCheckboxFilter

**Category:** Features/Filter/Components

## Design

### Overview

Use `MultiInlineCheckboxFilter` for rendering an inline list of known number of items, with checkboxes.

> Note: Use this filter only in a "filters panel", and not in the toolbar itself, since it's not a dropdown.


```tsx
import { MultiInlineCheckboxFilter } from '@wix/patterns';
```

---

### Examples

### Basic

```tsx
import React from 'react';
import { idNameArrayFilter, MultiInlineCheckboxFilter } from '@wix/patterns';

function BasicMultiInlineCheckboxFilter() {
  const [filter] = React.useState(() => idNameArrayFilter());

  return (
    <MultiInlineCheckboxFilter
      filter={filter}
      data={[
        'Beginner',
        'Amateur',
        'Semi-Pro',
        'Professional',
        'World Class',
        'Legendary',
        'Ultimate',
      ].map((name) => ({ id: name, name }))}
    />
  );
}
```

## API

### Extends

[MultiSelect](https://www.docs.wixdesignsystem.com/?path=/story/components-form--multiselect)

### Props

| Prop | Type | Required | Default | Description |
|------|------|----------|---------|-------------|
| `data` | `V[]` | Yes | - | List of items to select from |
| `renderItem` | `((item: V, index: number) => Partial<PropsWithChildren<CheckboxProps>>)` | No | - | A function that returns checkbox props for rendering each item checkbox |
| `filter` | `Filter<V[]>` | Yes | - | A filter state object such as [ArrayFilter](./?path=/story/features-filter-factories--arrayfilter) |
| `fieldType` | `"SHORT_TEXT" \| "LONG_TEXT" \| "NUMBER" \| "BOOLEAN" \| "DATE" \| "DATE_TIME" \| "DATETIME" \| "TIME" \| "URL" \| "EMAIL" \| "IMAGE" \| "MEDIA_GALLERY" \| "AUDIO" \| "DOCUMENT" \| "MULTI_DOCUMENT" \| "RICH_TEXT" \| "RICH_CONTENT" \| "REFERENCE" \| "MULTI_REFERENCE" \| "OBJECT" \| "ARRAY" \| "ADDRESS" \| "COLOR" \| "INTEGER" \| "DECIMAL" \| "CHECKBOX" \| "DROPDOWN" \| "FILES" \| "MULTI_SELECT"` | No | - | The field type string used to resolve a prefix icon for the filter. Cairo maps this to the appropriate icon internally. |
| `layout` | `"button"` | No | - | Padding settings. If this prop it omitted, padding will exist on the sides of the filter.<br> <br> Supported values: <br> - `"button"`: Removes padding from the sides of the filter. |
| `toolbarItemProps` | `{ label?: ReactNode; }` | No | - | Customizes the filter in the toolbar.<br> <br> Supported properties: <br> - `label`: [string] Prefix for the filter element. |
| `toolbarTagProps` | `{ label?: string; }` | No | - | Customizes the filter tag in the toolbar.<br> <br> Supported properties: <br> - `label`: [string] Overrides the default filter name when filtered tag is shown. |
| `initiallyOpen` | `boolean` | No | - | Indicates whether the filter should be visible by default in the filters panel |
| `accordionItemProps` | `(AccordionItemType & { label?: string; })` | No | - | Customizes the filter [accordion](https://www.docs.wixdesignsystem.com/?path=/story/components-lists--accordion).<br> <br> Supported properties: <br> - `label`: [string] Accordion item title. You can also use `AccordionProps['items'][number].title` for more flexibility. <br> - Extends [AccordionProps['items'[number]](https://www.docs.wixdesignsystem.com/?path=/story/components-lists--accordion). |
| `popoverProps` | `PopoverCommonProps` | No | - | @deprecated |
| `onAppliedFilterTagRemove` | `((item: V) => unknown)` | No | - | Callback that's run when a filter is removed by a visitor from the sub-toolbar. @param item |
| `renderToolbarTag` | `((item: V) => Partial<TagListTag>)` | No | - | Customizes how the tag list in the sub-toolbar is rendered. <br><br> Extends [`TagListProps['tags'][number]`](https://www.docs.wixdesignsystem.com/?path=/story/components-lists-table--taglist). |
| `sectionTitle` | `string` | No | - | Title for the section in the accordion. |
| `dataHook` | `string` | No | - | Accepts HTML attributes that can be used in the tests |
| `className` | `string` | No | - | Specifies a CSS class name to be appended to the component’s root element. |
| `overflow` | `Overflow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `[ visible \| hidden \| clip \| scroll \| auto ]{1,2}` **Initial value**: `visible` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/overflow |
| `children` | `ReactNode` | No | - | Allows to render any component as a child item |
| `role` | `AriaRole` | No | - | Sets the WAI-ARIA role attribute for accessibility. When set to 'button' or 'link', the box automatically receives tabIndex=0 for keyboard navigation. |
| `ariaLabel` | `string` | No | - | Sets the WAI-ARIA label attribute, providing an accessible name for assistive technologies like screen readers. |
| `border` | `string` | No | - | Enables a border and sets its width and style. This prop does not include WSR color variable keys. This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-width> \|\| <line-style> \|\| <color>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border |
| `textOverflow` | `TextOverflow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `[ clip \| ellipsis \| <string> ]{1,2}` **Initial value**: `clip` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :---: \| \| **1** \| **7** \| **1.3** \| **12** \| **6** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-overflow |
| `overlay` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| auto` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **117** \| No \| No \| **117** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/overlay |
| `clip` | `Clip` | No | - | The **`clip`** CSS property defines a visible portion of an element. The `clip` property applies only to absolutely positioned elements — that is, elements with `position:absolute` or `position:fixed`. **Syntax**: `<shape> \| auto` **Initial value**: `auto` @deprecated |
| `top` | `Top<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| <length-percentage> \| <anchor()> \| <anchor-size()>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/top |
| `right` | `Right<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| <length-percentage> \| <anchor()> \| <anchor-size()>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-----: \| \| **1** \| **1** \| **1** \| **12** \| **5.5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/right |
| `bottom` | `Bottom<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| <length-percentage> \| <anchor()> \| <anchor-size()>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/bottom |
| `left` | `Left<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| <length-percentage> \| <anchor()> \| <anchor-size()>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-----: \| \| **1** \| **1** \| **1** \| **12** \| **5.5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/left |
| `maxWidth` | `any` | No | - | Sets the maximum width of the box in pixels This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `none \| <length-percentage [0,∞]> \| min-content \| max-content \| fit-content \| fit-content(<length-percentage [0,∞]>) \| <calc-size()> \| <anchor-size()>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **7** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/max-width |
| `align` | `"right" \| "left" \| "center" \| "space-between"` | No | - | Defines how the children are aligned according to the X axis |
| `page` | `Page` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since February 2023. **Syntax**: `auto \| <custom-ident>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **85** \| **110** \| **1** \| **85** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/page |
| `inline` | `boolean` | No | - | Defines if the box behaves as an inline element |
| `width` | `any` | No | - | Sets the width of the box in pixels This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| <length-percentage [0,∞]> \| min-content \| max-content \| fit-content \| fit-content(<length-percentage [0,∞]>) \| <calc-size()> \| <anchor-size()>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/width |
| `zIndex` | `ZIndex` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| <integer>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/z-index |
| `minHeight` | `any` | No | - | Sets the minimum height of the box in pixels This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| <length-percentage [0,∞]> \| min-content \| max-content \| fit-content \| fit-content(<length-percentage [0,∞]>) \| <calc-size()> \| <anchor-size()>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :---: \| \| **1** \| **3** \| **1.3** \| **12** \| **7** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/min-height |
| `grid` | `Grid` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `<'grid-template'> \| <'grid-template-rows'> / [ auto-flow && dense? ] <'grid-auto-columns'>? \| [ auto-flow && dense? ] <'grid-auto-rows'>? / <'grid-template-columns'>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **52** \| **10.1** \| **16** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid |
| `fill` | `Fill` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `<paint>` **Initial value**: `black` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **3** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/fill |
| `container` | `Container` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since February 2023. **Syntax**: `<'container-name'> [ / <'container-type'> ]?` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **105** \| **110** \| **16** \| **105** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/container |
| `direction` | `"horizontal" \| "vertical"` | No | - | Defines how the children are ordered (horizontally or vertically) |
| `accentColor` | `AccentColor` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `auto \| <color>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **93** \| **92** \| **15.4** \| **93** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/accent-color |
| `alignContent` | `AlignContent` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `normal \| <baseline-position> \| <content-distribution> \| <overflow-position>? <content-position>` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :-----: \| :----: \| :----: \| \| **29** \| **28** \| **9** \| **12** \| **11** \| \| 21 _-x-_ \| \| 7 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/align-content |
| `alignSelf` | `AlignSelf` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `auto \| normal \| stretch \| <baseline-position> \| <overflow-position>? <self-position> \| anchor-center` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :-----: \| :----: \| :----: \| \| **29** \| **20** \| **9** \| **12** \| **10** \| \| 21 _-x-_ \| \| 7 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/align-self |
| `alignTracks` | `AlignTracks` | No | - | **Syntax**: `[ normal \| <baseline-position> \| <content-distribution> \| <overflow-position>? <content-position> ]#` **Initial value**: `normal` |
| `alignmentBaseline` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "middle" \| "baseline" \| "alphabetic" \| "central" \| "ideographic" \| "mathematical" \| "text-after-edge" \| "text-before-edge"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `baseline \| alphabetic \| ideographic \| middle \| central \| mathematical \| text-before-edge \| text-after-edge` **Initial value**: `baseline` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :-: \| \| **1** \| No \| **5.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/alignment-baseline |
| `anchorName` | `AnchorName` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| <dashed-ident>#` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :---------: \| :----: \| :-----: \| :-: \| \| **125** \| **preview** \| **26** \| **125** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/anchor-name |
| `anchorScope` | `AnchorScope` | No | - | **Syntax**: `none \| all \| <dashed-ident>#` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :---------: \| :----: \| :-----: \| :-: \| \| **131** \| **preview** \| **26** \| **131** \| No \| |
| `animationComposition` | `AnimationComposition` | No | - | Since July 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<single-animation-composition>#` **Initial value**: `replace` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **112** \| **115** \| **16** \| **112** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/animation-composition |
| `animationDelay` | `AnimationDelay<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<time>#` **Initial value**: `0s` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **43** \| **16** \| **9** \| **12** \| **10** \| \| 3 _-x-_ \| 5 _-x-_ \| 4 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/animation-delay |
| `animationDirection` | `AnimationDirection` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-direction>#` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **43** \| **16** \| **9** \| **12** \| **10** \| \| 3 _-x-_ \| 5 _-x-_ \| 4 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/animation-direction |
| `animationDuration` | `AnimationDuration<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `[ auto \| <time [0s,∞]> ]#` **Initial value**: `0s` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **43** \| **16** \| **9** \| **12** \| **10** \| \| 3 _-x-_ \| 5 _-x-_ \| 4 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/animation-duration |
| `animationFillMode` | `AnimationFillMode` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-fill-mode>#` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **43** \| **16** \| **9** \| **12** \| **10** \| \| 3 _-x-_ \| 5 _-x-_ \| 5 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/animation-fill-mode |
| `animationIterationCount` | `AnimationIterationCount` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-iteration-count>#` **Initial value**: `1` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **43** \| **16** \| **9** \| **12** \| **10** \| \| 3 _-x-_ \| 5 _-x-_ \| 4 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/animation-iteration-count |
| `animationName` | `AnimationName` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `[ none \| <keyframes-name> ]#` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **43** \| **16** \| **9** \| **12** \| **10** \| \| 3 _-x-_ \| 5 _-x-_ \| 4 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/animation-name |
| `animationPlayState` | `AnimationPlayState` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-play-state>#` **Initial value**: `running` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **43** \| **16** \| **9** \| **12** \| **10** \| \| 3 _-x-_ \| 5 _-x-_ \| 4 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/animation-play-state |
| `animationRangeEnd` | `AnimationRangeEnd<string \| number>` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ normal \| <length-percentage> \| <timeline-range-name> <length-percentage>? ]#` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **115** \| No \| **26** \| **115** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/animation-range-end |
| `animationRangeStart` | `AnimationRangeStart<string \| number>` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ normal \| <length-percentage> \| <timeline-range-name> <length-percentage>? ]#` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **115** \| No \| **26** \| **115** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/animation-range-start |
| `animationTimeline` | `AnimationTimeline` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `<single-animation-timeline>#` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **115** \| No \| **26** \| **115** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/animation-timeline |
| `animationTimingFunction` | `AnimationTimingFunction` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<easing-function>#` **Initial value**: `ease` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **43** \| **16** \| **9** \| **12** \| **10** \| \| 3 _-x-_ \| 5 _-x-_ \| 4 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/animation-timing-function |
| `appearance` | `"auto" \| "none" \| "button" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "checkbox" \| "listbox" \| "radio" \| "menulist" \| "meter" \| "progress-bar" \| "searchfield" \| "textarea" \| "menulist-button" \| "textfield"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `none \| auto \| <compat-auto> \| <compat-special>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :------: \| :-: \| \| **84** \| **80** \| **15.4** \| **84** \| No \| \| 1 _-x-_ \| 1 _-x-_ \| 3 _-x-_ \| 12 _-x-_ \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/appearance |
| `aspectRatio` | `AspectRatio` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `auto \|\| <ratio>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **88** \| **89** \| **15** \| **88** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/aspect-ratio |
| `backdropFilter` | `BackdropFilter` | No | - | Since September 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `none \| <filter-value-list>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :-: \| \| **76** \| **103** \| **18** \| **79** \| No \| \| \| \| 9 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/backdrop-filter |
| `backfaceVisibility` | `"visible" \| "hidden" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `visible \| hidden` **Initial value**: `visible` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :------: \| :-------: \| :----: \| :----: \| \| **36** \| **16** \| **15.4** \| **12** \| **10** \| \| 12 _-x-_ \| 10 _-x-_ \| 5.1 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/backface-visibility |
| `backgroundAttachment` | `BackgroundAttachment` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<attachment>#` **Initial value**: `scroll` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/background-attachment |
| `backgroundBlendMode` | `BackgroundBlendMode` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<blend-mode>#` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **35** \| **30** \| **8** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/background-blend-mode |
| `backgroundClip` | `BackgroundClip` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<bg-clip>#` **Initial value**: `border-box` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :---: \| \| **1** \| **4** \| **5** \| **12** \| **9** \| \| \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/background-clip |
| `backgroundColor` | `string` | No | - | Sets a background color by a key from the color palette or natively supported value (Hex, RGB, etc.) This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<color>` **Initial value**: `transparent` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/background-color |
| `backgroundImage` | `BackgroundImage` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<bg-image>#` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/background-image |
| `backgroundOrigin` | `BackgroundOrigin` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<visual-box>#` **Initial value**: `padding-box` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **4** \| **3** \| **12** \| **9** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/background-origin |
| `backgroundPositionX` | `BackgroundPositionX<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2016. **Syntax**: `[ center \| [ [ left \| right \| x-start \| x-end ]? <length-percentage>? ]! ]#` **Initial value**: `0%` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **49** \| **1** \| **12** \| **6** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/background-position-x |
| `backgroundPositionY` | `BackgroundPositionY<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2016. **Syntax**: `[ center \| [ [ top \| bottom \| y-start \| y-end ]? <length-percentage>? ]! ]#` **Initial value**: `0%` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **49** \| **1** \| **12** \| **6** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/background-position-y |
| `backgroundRepeat` | `BackgroundRepeat` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<repeat-style>#` **Initial value**: `repeat` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/background-repeat |
| `backgroundSize` | `BackgroundSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<bg-size>#` **Initial value**: `auto auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :---: \| \| **3** \| **4** \| **5** \| **12** \| **9** \| \| 1 _-x-_ \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/background-size |
| `baselineShift` | `BaselineShift<string \| number>` | No | - | **Syntax**: `<length-percentage> \| sub \| super \| baseline` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **1** \| No \| **4** \| **79** \| No \| |
| `blockSize` | `BlockSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'width'>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :--------------------------: \| :-----: \| :----------------------------: \| :----: \| :-: \| \| **57** \| **41** \| **12.1** \| **79** \| No \| \| 8 _(-webkit-logical-height)_ \| \| 5.1 _(-webkit-logical-height)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/block-size |
| `borderBlockEndColor` | `BorderBlockEndColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-color'>` **Initial value**: `currentcolor` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-block-end-color |
| `borderBlockEndStyle` | `"hidden" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inset" \| "dashed" \| "dotted" \| "double" \| "groove" \| "outset" \| "ridge" \| "solid"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-style'>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-block-end-style |
| `borderBlockEndWidth` | `BorderBlockEndWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-width'>` **Initial value**: `medium` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-block-end-width |
| `borderBlockStartColor` | `BorderBlockStartColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-color'>` **Initial value**: `currentcolor` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-block-start-color |
| `borderBlockStartStyle` | `"hidden" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inset" \| "dashed" \| "dotted" \| "double" \| "groove" \| "outset" \| "ridge" \| "solid"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-style'>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-block-start-style |
| `borderBlockStartWidth` | `BorderBlockStartWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-width'>` **Initial value**: `medium` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-block-start-width |
| `borderBottomColor` | `string` | No | - | Sets a border bottom color by a key from the color palette or natively supported value (Hex, RGB, etc.) This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<'border-top-color'>` **Initial value**: `currentcolor` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-bottom-color |
| `borderBottomLeftRadius` | `BorderBottomLeftRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,2}` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :---: \| \| **4** \| **4** \| **5** \| **12** \| **9** \| \| 1 _-x-_ \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-bottom-left-radius |
| `borderBottomRightRadius` | `BorderBottomRightRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,2}` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :---: \| \| **4** \| **4** \| **5** \| **12** \| **9** \| \| 1 _-x-_ \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-bottom-right-radius |
| `borderBottomStyle` | `"hidden" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inset" \| "dashed" \| "dotted" \| "double" \| "groove" \| "outset" \| "ridge" \| "solid"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-style>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-----: \| \| **1** \| **1** \| **1** \| **12** \| **5.5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-bottom-style |
| `borderBottomWidth` | `BorderBottomWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-width>` **Initial value**: `medium` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-bottom-width |
| `borderCollapse` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "collapse" \| "separate"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `separate \| collapse` **Initial value**: `separate` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :---: \| \| **1** \| **1** \| **1.1** \| **12** \| **5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-collapse |
| `borderEndEndRadius` | `BorderEndEndRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `<'border-top-left-radius'>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **89** \| **66** \| **15** \| **89** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-end-end-radius |
| `borderEndStartRadius` | `BorderEndStartRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `<'border-top-left-radius'>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **89** \| **66** \| **15** \| **89** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-end-start-radius |
| `borderImageOutset` | `BorderImageOutset<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `[ <length [0,∞]> \| <number [0,∞]> ]{1,4} ` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :----: \| \| **15** \| **15** \| **6** \| **12** \| **11** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-image-outset |
| `borderImageRepeat` | `BorderImageRepeat` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2016. **Syntax**: `[ stretch \| repeat \| round \| space ]{1,2}` **Initial value**: `stretch` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :----: \| \| **15** \| **15** \| **6** \| **12** \| **11** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-image-repeat |
| `borderImageSlice` | `BorderImageSlice` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `[ <number [0,∞]> \| <percentage [0,∞]> ]{1,4} && fill?` **Initial value**: `100%` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :----: \| \| **15** \| **15** \| **6** \| **12** \| **11** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-image-slice |
| `borderImageSource` | `BorderImageSource` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `none \| <image>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :----: \| \| **15** \| **15** \| **6** \| **12** \| **11** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-image-source |
| `borderImageWidth` | `BorderImageWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `[ <length-percentage [0,∞]> \| <number [0,∞]> \| auto ]{1,4}` **Initial value**: `1` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :----: \| \| **16** \| **13** \| **6** \| **12** \| **11** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-image-width |
| `borderInlineEndColor` | `BorderInlineEndColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-color'>` **Initial value**: `currentcolor` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-------------------------: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| \| \| 3 _(-moz-border-end-color)_ \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-inline-end-color |
| `borderInlineEndStyle` | `"hidden" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inset" \| "dashed" \| "dotted" \| "double" \| "groove" \| "outset" \| "ridge" \| "solid"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-style'>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-------------------------: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| \| \| 3 _(-moz-border-end-style)_ \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-inline-end-style |
| `borderInlineEndWidth` | `BorderInlineEndWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-width'>` **Initial value**: `medium` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-------------------------: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| \| \| 3 _(-moz-border-end-width)_ \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-inline-end-width |
| `borderInlineStartColor` | `BorderInlineStartColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-color'>` **Initial value**: `currentcolor` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :---------------------------: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| \| \| 3 _(-moz-border-start-color)_ \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-inline-start-color |
| `borderInlineStartStyle` | `"hidden" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inset" \| "dashed" \| "dotted" \| "double" \| "groove" \| "outset" \| "ridge" \| "solid"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-style'>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :---------------------------: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| \| \| 3 _(-moz-border-start-style)_ \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-inline-start-style |
| `borderInlineStartWidth` | `BorderInlineStartWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-width'>` **Initial value**: `medium` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-inline-start-width |
| `borderLeftColor` | `string` | No | - | Sets a border left color by a key from the color palette or natively supported value (Hex, RGB, etc.) This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<color>` **Initial value**: `currentcolor` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-left-color |
| `borderLeftStyle` | `"hidden" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inset" \| "dashed" \| "dotted" \| "double" \| "groove" \| "outset" \| "ridge" \| "solid"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-style>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-----: \| \| **1** \| **1** \| **1** \| **12** \| **5.5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-left-style |
| `borderLeftWidth` | `BorderLeftWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-width>` **Initial value**: `medium` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-left-width |
| `borderRightColor` | `string` | No | - | Sets a border right color by a key from the color palette or natively supported value (Hex, RGB, etc.) This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<color>` **Initial value**: `currentcolor` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-right-color |
| `borderRightStyle` | `"hidden" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inset" \| "dashed" \| "dotted" \| "double" \| "groove" \| "outset" \| "ridge" \| "solid"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-style>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-----: \| \| **1** \| **1** \| **1** \| **12** \| **5.5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-right-style |
| `borderRightWidth` | `BorderRightWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-width>` **Initial value**: `medium` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-right-width |
| `borderSpacing` | `BorderSpacing<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length>{1,2}` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **8** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-spacing |
| `borderStartEndRadius` | `BorderStartEndRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `<'border-top-left-radius'>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **89** \| **66** \| **15** \| **89** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-start-end-radius |
| `borderStartStartRadius` | `BorderStartStartRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `<'border-top-left-radius'>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **89** \| **66** \| **15** \| **89** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-start-start-radius |
| `borderTopColor` | `string` | No | - | Sets a border top color by a key from the color palette or natively supported value (Hex, RGB, etc.) This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<color>` **Initial value**: `currentcolor` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-top-color |
| `borderTopLeftRadius` | `BorderTopLeftRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,2}` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :---: \| \| **4** \| **4** \| **5** \| **12** \| **9** \| \| 1 _-x-_ \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-top-left-radius |
| `borderTopRightRadius` | `BorderTopRightRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,2}` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :---: \| \| **4** \| **4** \| **5** \| **12** \| **9** \| \| 1 _-x-_ \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-top-right-radius |
| `borderTopStyle` | `"hidden" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inset" \| "dashed" \| "dotted" \| "double" \| "groove" \| "outset" \| "ridge" \| "solid"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-style>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-----: \| \| **1** \| **1** \| **1** \| **12** \| **5.5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-top-style |
| `borderTopWidth` | `BorderTopWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-width>` **Initial value**: `medium` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-top-width |
| `boxDecorationBreak` | `"slice" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "clone"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `slice \| clone` **Initial value**: `slice` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :---------: \| :------: \| :-: \| \| **130** \| **32** \| **7** _-x-_ \| **130** \| No \| \| 22 _-x-_ \| \| \| 79 _-x-_ \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/box-decoration-break |
| `boxShadow` | `BoxShadow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `none \| <shadow>#` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :---: \| \| **10** \| **4** \| **5.1** \| **12** \| **9** \| \| 1 _-x-_ \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/box-shadow |
| `boxSizing` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "border-box" \| "content-box"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `content-box \| border-box` **Initial value**: `content-box` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :---: \| \| **10** \| **29** \| **5.1** \| **12** \| **8** \| \| 1 _-x-_ \| 1 _-x-_ \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/box-sizing |
| `breakAfter` | `"auto" \| "right" \| "left" \| "page" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "all" \| "region" \| "always" \| "avoid" \| "avoid-column" \| "avoid-page" \| "avoid-region" \| "column" \| "recto" \| "verso"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2019. **Syntax**: `auto \| avoid \| always \| all \| avoid-page \| page \| left \| right \| recto \| verso \| avoid-column \| column \| avoid-region \| region` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :----: \| \| **50** \| **65** \| **10** \| **12** \| **10** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/break-after |
| `breakBefore` | `"auto" \| "right" \| "left" \| "page" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "all" \| "region" \| "always" \| "avoid" \| "avoid-column" \| "avoid-page" \| "avoid-region" \| "column" \| "recto" \| "verso"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2019. **Syntax**: `auto \| avoid \| always \| all \| avoid-page \| page \| left \| right \| recto \| verso \| avoid-column \| column \| avoid-region \| region` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :----: \| \| **50** \| **65** \| **10** \| **12** \| **10** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/break-before |
| `breakInside` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "avoid" \| "avoid-column" \| "avoid-page" \| "avoid-region"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2019. **Syntax**: `auto \| avoid \| avoid-page \| avoid-column \| avoid-region` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :----: \| \| **50** \| **65** \| **10** \| **12** \| **10** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/break-inside |
| `captionSide` | `"top" \| "bottom" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `top \| bottom` **Initial value**: `top` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **8** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/caption-side |
| `caretColor` | `CaretColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `auto \| <color>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **53** \| **11.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/caret-color |
| `caretShape` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "bar" \| "block" \| "underscore"` | No | - | **Syntax**: `auto \| bar \| block \| underscore` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :--: \| :-: \| \| No \| No \| No \| No \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/caret-shape |
| `clear` | `"none" \| "right" \| "left" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "both" \| "inline-end" \| "inline-start"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `none \| left \| right \| both \| inline-start \| inline-end` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/clear |
| `clipPath` | `ClipPath` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<clip-source> \| [ <basic-shape> \|\| <geometry-box> ] \| none` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :-----: \| :----: \| :----: \| \| **55** \| **3.5** \| **9.1** \| **79** \| **10** \| \| 23 _-x-_ \| \| 7 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/clip-path |
| `clipRule` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "evenodd" \| "nonzero"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `nonzero \| evenodd` **Initial value**: `nonzero` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :----: \| :-: \| \| **≤15** \| **3.5** \| **≤5** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/clip-rule |
| `color` | `string` | No | - | Sets a text color by a key from the color palette or natively supported value (Hex, RGB, etc.) This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<color>` **Initial value**: `canvastext` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **3** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/color |
| `colorAdjust` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "economy" \| "exact"` | No | - | Since May 2025, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `economy \| exact` **Initial value**: `economy` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----------------: \| :------: \| :------: \| :-: \| \| **136** \| **97** \| **15.4** \| **136** \| No \| \| 17 _-x-_ \| 48 _(color-adjust)_ \| 6 _-x-_ \| 79 _-x-_ \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/print-color-adjust |
| `colorInterpolationFilters` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "linearRGB" \| "sRGB"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `auto \| sRGB \| linearRGB` **Initial value**: `linearRGB` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **1** \| **3** \| **3** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/color-interpolation-filters |
| `colorScheme` | `ColorScheme` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2022. **Syntax**: `normal \| [ light \| dark \| <custom-ident> ]+ && only?` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **81** \| **96** \| **13** \| **81** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/color-scheme |
| `columnCount` | `ColumnCount` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<integer> \| auto` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **50** \| **52** \| **9** \| **12** \| **10** \| \| 1 _-x-_ \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/column-count |
| `columnFill` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "balance"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `auto \| balance` **Initial value**: `balance` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :----: \| \| **50** \| **52** \| **9** \| **12** \| **10** \| \| \| \| 8 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/column-fill |
| `columnGap` | `ColumnGap<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `normal \| <length-percentage>` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :----: \| \| **1** \| **1.5** \| **3** \| **12** \| **10** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/column-gap |
| `columnRuleColor` | `ColumnRuleColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<color>` **Initial value**: `currentcolor` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **50** \| **52** \| **9** \| **12** \| **10** \| \| 1 _-x-_ \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/column-rule-color |
| `columnRuleStyle` | `ColumnRuleStyle` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<'border-style'>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **50** \| **52** \| **9** \| **12** \| **10** \| \| 1 _-x-_ \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/column-rule-style |
| `columnRuleWidth` | `ColumnRuleWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<'border-width'>` **Initial value**: `medium` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **50** \| **52** \| **9** \| **12** \| **10** \| \| 1 _-x-_ \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/column-rule-width |
| `columnSpan` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "all"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `none \| all` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-------: \| :----: \| :----: \| \| **50** \| **71** \| **9** \| **12** \| **10** \| \| 6 _-x-_ \| \| 5.1 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/column-span |
| `columnWidth` | `ColumnWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since November 2016. **Syntax**: `<length> \| auto` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **50** \| **50** \| **9** \| **12** \| **10** \| \| 1 _-x-_ \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/column-width |
| `contain` | `Contain` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `none \| strict \| content \| [ [ size \|\| inline-size ] \|\| layout \|\| style \|\| paint ]` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **52** \| **69** \| **15.4** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/contain |
| `containIntrinsicBlockSize` | `ContainIntrinsicBlockSize<string \| number>` | No | - | Since September 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `auto? [ none \| <length> ]` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **95** \| **107** \| **17** \| **95** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/contain-intrinsic-block-size |
| `containIntrinsicHeight` | `ContainIntrinsicHeight<string \| number>` | No | - | Since September 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `auto? [ none \| <length> ]` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **95** \| **107** \| **17** \| **95** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/contain-intrinsic-height |
| `containIntrinsicInlineSize` | `ContainIntrinsicInlineSize<string \| number>` | No | - | Since September 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `auto? [ none \| <length> ]` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **95** \| **107** \| **17** \| **95** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/contain-intrinsic-inline-size |
| `containIntrinsicWidth` | `ContainIntrinsicWidth<string \| number>` | No | - | Since September 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `auto? [ none \| <length> ]` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **95** \| **107** \| **17** \| **95** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/contain-intrinsic-width |
| `containerName` | `ContainerName` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since February 2023. **Syntax**: `none \| <custom-ident>+` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **105** \| **110** \| **16** \| **105** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/container-name |
| `containerType` | `ContainerType` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since February 2023. **Syntax**: `normal \| [ [ size \| inline-size ] \|\| scroll-state ]` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **105** \| **110** \| **16** \| **105** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/container-type |
| `content` | `Content` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `normal \| none \| [ <content-replacement> \| <content-list> ] [ / [ <string> \| <counter> \| <attr()> ]+ ]?` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **8** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/content |
| `contentVisibility` | `"visible" \| "hidden" \| "auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | Since September 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `visible \| auto \| hidden` **Initial value**: `visible` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **85** \| **125** \| **18** \| **85** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/content-visibility |
| `counterIncrement` | `CounterIncrement` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `[ <counter-name> <integer>? ]+ \| none` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **2** \| **1** \| **3** \| **12** \| **8** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/counter-increment |
| `counterReset` | `CounterReset` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `[ <counter-name> <integer>? \| <reversed-counter-name> <integer>? ]+ \| none` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **2** \| **1** \| **3** \| **12** \| **8** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/counter-reset |
| `counterSet` | `CounterSet` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `[ <counter-name> <integer>? ]+ \| none` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **85** \| **68** \| **17.2** \| **85** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/counter-set |
| `cursor` | `Cursor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since December 2021. **Syntax**: `[ [ <url> [ <x> <y> ]? , ]* <cursor-predefined> ]` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :---: \| \| **1** \| **1** \| **1.2** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/cursor |
| `cx` | `Cx<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `<length> \| <percentage>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **43** \| **69** \| **9** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/cx |
| `cy` | `Cy<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `<length> \| <percentage>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **43** \| **69** \| **9** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/cy |
| `d` | `D` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| path(<string>)` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **52** \| **97** \| No \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/d |
| `display` | `Display` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `[ <display-outside> \|\| <display-inside> ] \| <display-listitem> \| <display-internal> \| <display-box> \| <display-legacy>` **Initial value**: `inline` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/display |
| `dominantBaseline` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "middle" \| "text-bottom" \| "text-top" \| "alphabetic" \| "central" \| "ideographic" \| "mathematical" \| "hanging"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `auto \| text-bottom \| alphabetic \| ideographic \| middle \| central \| mathematical \| hanging \| text-top` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **1** \| **1** \| **4** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/dominant-baseline |
| `emptyCells` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "hide" \| "show"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `show \| hide` **Initial value**: `show` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :---: \| \| **1** \| **1** \| **1.2** \| **12** \| **8** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/empty-cells |
| `fieldSizing` | `"fixed" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "content"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `content \| fixed` **Initial value**: `fixed` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :---------: \| :-----: \| :-: \| \| **123** \| No \| **preview** \| **123** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/field-sizing |
| `fillOpacity` | `FillOpacity` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `<'opacity'>` **Initial value**: `1` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **1** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/fill-opacity |
| `fillRule` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "evenodd" \| "nonzero"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `nonzero \| evenodd` **Initial value**: `nonzero` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **3** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/fill-rule |
| `flexBasis` | `FlexBasis<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `content \| <'width'>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :-----: \| :----: \| :----: \| \| **29** \| **22** \| **9** \| **12** \| **11** \| \| 22 _-x-_ \| \| 7 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/flex-basis |
| `flexGrow` | `FlexGrow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<number>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :-----: \| :----: \| :----------------------: \| \| **29** \| **20** \| **9** \| **12** \| **11** \| \| 22 _-x-_ \| \| 7 _-x-_ \| \| 10 _(-ms-flex-positive)_ \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/flex-grow |
| `flexShrink` | `FlexShrink` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<number>` **Initial value**: `1` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :-----: \| :----: \| :----: \| \| **29** \| **20** \| **9** \| **12** \| **10** \| \| 22 _-x-_ \| \| 8 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/flex-shrink |
| `flexWrap` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "nowrap" \| "wrap" \| "wrap-reverse"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `nowrap \| wrap \| wrap-reverse` **Initial value**: `nowrap` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :-----: \| :----: \| :----: \| \| **29** \| **28** \| **9** \| **12** \| **11** \| \| 21 _-x-_ \| \| 7 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/flex-wrap |
| `float` | `"none" \| "right" \| "left" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inline-end" \| "inline-start"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `left \| right \| none \| inline-start \| inline-end` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/float |
| `floodColor` | `FloodColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<color>` **Initial value**: `black` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-----: \| \| **5** \| **3** \| **6** \| **12** \| **≤11** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/flood-color |
| `floodOpacity` | `FloodOpacity` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<'opacity'>` **Initial value**: `black` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-----: \| \| **5** \| **3** \| **6** \| **12** \| **≤11** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/flood-opacity |
| `fontFamily` | `FontFamily` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `[ <family-name> \| <generic-family> ]#` **Initial value**: depends on user agent \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **3** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-family |
| `fontFeatureSettings` | `FontFeatureSettings` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `normal \| <feature-tag-value>#` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :------: \| :-----: \| :----: \| :----: \| \| **48** \| **34** \| **9.1** \| **15** \| **10** \| \| 16 _-x-_ \| 15 _-x-_ \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-feature-settings |
| `fontKerning` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `auto \| normal \| none` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :-: \| \| **33** \| **32** \| **9** \| **79** \| No \| \| \| \| 6 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-kerning |
| `fontLanguageOverride` | `FontLanguageOverride` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `normal \| <string>` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **143** \| **34** \| No \| **143** \| No \| \| \| 4 _-x-_ \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-language-override |
| `fontOpticalSizing` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2020. **Syntax**: `auto \| none` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **79** \| **62** \| **13.1** \| **17** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-optical-sizing |
| `fontPalette` | `FontPalette` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since November 2022. **Syntax**: `normal \| light \| dark \| <palette-identifier> \| <palette-mix()>` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **101** \| **107** \| **15.4** \| **101** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-palette |
| `fontSize` | `FontSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<absolute-size> \| <relative-size> \| <length-percentage [0,∞]> \| math` **Initial value**: `medium` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-----: \| \| **1** \| **1** \| **1** \| **12** \| **5.5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-size |
| `fontSizeAdjust` | `FontSizeAdjust` | No | - | Since July 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `none \| [ ex-height \| cap-height \| ch-width \| ic-width \| ic-height ]? [ from-font \| <number> ]` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **127** \| **3** \| **16.4** \| **127** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-size-adjust |
| `fontSmooth` | `FontSmooth<string \| number>` | No | - | The **`font-smooth`** CSS property controls the application of anti-aliasing when fonts are rendered. **Syntax**: `auto \| never \| always \| <absolute-size> \| <length>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------------------------------: \| :--------------------------------: \| :------------------------------: \| :-------------------------------: \| :-: \| \| **5** _(-webkit-font-smoothing)_ \| **25** _(-moz-osx-font-smoothing)_ \| **4** _(-webkit-font-smoothing)_ \| **79** _(-webkit-font-smoothing)_ \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-smooth |
| `fontStyle` | `FontStyle` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `normal \| italic \| oblique <angle>?` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-style |
| `fontSynthesis` | `FontSynthesis` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2022. **Syntax**: `none \| [ weight \|\| style \|\| small-caps \|\| position]` **Initial value**: `weight style small-caps position ` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **97** \| **34** \| **9** \| **97** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-synthesis |
| `fontSynthesisPosition` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `auto \| none` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :--: \| :-: \| \| No \| **118** \| No \| No \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-synthesis-position |
| `fontSynthesisSmallCaps` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2023. **Syntax**: `auto \| none` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **97** \| **111** \| **16.4** \| **97** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-synthesis-small-caps |
| `fontSynthesisStyle` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2023. **Syntax**: `auto \| none` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **97** \| **111** \| **16.4** \| **97** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-synthesis-style |
| `fontSynthesisWeight` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2023. **Syntax**: `auto \| none` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **97** \| **111** \| **16.4** \| **97** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-synthesis-weight |
| `fontVariant` | `FontVariant` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `normal \| none \| [ <common-lig-values> \|\| <discretionary-lig-values> \|\| <historical-lig-values> \|\| <contextual-alt-values> \|\| stylistic( <feature-value-name> ) \|\| historical-forms \|\| styleset( <feature-value-name># ) \|\| character-variant( <feature-value-name># ) \|\| swash( <feature-value-name> ) \|\| ornaments( <feature-value-name> ) \|\| annotation( <feature-value-name> ) \|\| [ small-caps \| all-small-caps \| petite-caps \| all-petite-caps \| unicase \| titling-caps ] \|\| <numeric-figure-values> \|\| <numeric-spacing-values> \|\| <numeric-fraction-values> \|\| ordinal \|\| slashed-zero \|\| <east-asian-variant-values> \|\| <east-asian-width-values> \|\| ruby ]` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-variant |
| `fontVariantAlternates` | `FontVariantAlternates` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2023. **Syntax**: `normal \| [ stylistic( <feature-value-name> ) \|\| historical-forms \|\| styleset( <feature-value-name># ) \|\| character-variant( <feature-value-name># ) \|\| swash( <feature-value-name> ) \|\| ornaments( <feature-value-name> ) \|\| annotation( <feature-value-name> ) ]` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :-----: \| :-: \| \| **111** \| **34** \| **9.1** \| **111** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-variant-alternates |
| `fontVariantCaps` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "small-caps" \| "all-petite-caps" \| "all-small-caps" \| "petite-caps" \| "titling-caps" \| "unicase"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `normal \| small-caps \| all-small-caps \| petite-caps \| all-petite-caps \| unicase \| titling-caps` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :-: \| \| **52** \| **34** \| **9.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-variant-caps |
| `fontVariantEastAsian` | `FontVariantEastAsian` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `normal \| [ <east-asian-variant-values> \|\| <east-asian-width-values> \|\| ruby ]` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :-: \| \| **63** \| **34** \| **9.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-variant-east-asian |
| `fontVariantEmoji` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "text" \| "normal" \| "emoji" \| "unicode"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `normal \| text \| emoji \| unicode` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **131** \| **141** \| No \| **131** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-variant-emoji |
| `fontVariantLigatures` | `FontVariantLigatures` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `normal \| none \| [ <common-lig-values> \|\| <discretionary-lig-values> \|\| <historical-lig-values> \|\| <contextual-alt-values> ]` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :-----: \| :----: \| :-: \| \| **34** \| **34** \| **9.1** \| **79** \| No \| \| 31 _-x-_ \| \| 7 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-variant-ligatures |
| `fontVariantNumeric` | `FontVariantNumeric` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `normal \| [ <numeric-figure-values> \|\| <numeric-spacing-values> \|\| <numeric-fraction-values> \|\| ordinal \|\| slashed-zero ]` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :-: \| \| **52** \| **34** \| **9.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-variant-numeric |
| `fontVariantPosition` | `"sub" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "super" \| "normal"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `normal \| sub \| super` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :--: \| :-: \| \| No \| **34** \| **9.1** \| No \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-variant-position |
| `fontVariationSettings` | `FontVariationSettings` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2018. **Syntax**: `normal \| [ <string> <number> ]#` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **62** \| **62** \| **11** \| **17** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-variation-settings |
| `fontWeight` | `FontWeight` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<font-weight-absolute> \| bolder \| lighter` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **2** \| **1** \| **1** \| **12** \| **3** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font-weight |
| `fontWidth` | `FontWidth` | No | - | **Syntax**: `normal \| <percentage [0,∞]> \| ultra-condensed \| extra-condensed \| condensed \| semi-condensed \| semi-expanded \| expanded \| extra-expanded \| ultra-expanded` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :--: \| :-: \| \| No \| No \| **18.4** \| No \| No \| |
| `forcedColorAdjust` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "preserve-parent-color"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `auto \| none \| preserve-parent-color` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----------------------------: \| :---------------------------------: \| \| **89** \| **113** \| No \| **79** \| **10** _(-ms-high-contrast-adjust)_ \| \| \| \| \| 12 _(-ms-high-contrast-adjust)_ \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/forced-color-adjust |
| `gridAutoColumns` | `GridAutoColumns<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `<track-size>+` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-------------------------: \| \| **57** \| **70** \| **10.1** \| **16** \| **10** _(-ms-grid-columns)_ \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid-auto-columns |
| `gridAutoFlow` | `GridAutoFlow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `[ row \| column ] \|\| dense` **Initial value**: `row` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **52** \| **10.1** \| **16** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid-auto-flow |
| `gridAutoRows` | `GridAutoRows<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `<track-size>+` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :----------------------: \| \| **57** \| **70** \| **10.1** \| **16** \| **10** _(-ms-grid-rows)_ \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid-auto-rows |
| `gridColumnEnd` | `GridColumnEnd` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `<grid-line>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **52** \| **10.1** \| **16** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid-column-end |
| `gridColumnStart` | `GridColumnStart` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `<grid-line>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **52** \| **10.1** \| **16** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid-column-start |
| `gridRowEnd` | `GridRowEnd` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `<grid-line>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **52** \| **10.1** \| **16** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid-row-end |
| `gridRowStart` | `GridRowStart` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `<grid-line>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **52** \| **10.1** \| **16** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid-row-start |
| `gridTemplateAreas` | `GridTemplateAreas` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `none \| <string>+` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **52** \| **10.1** \| **16** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid-template-areas |
| `gridTemplateColumns` | `GridTemplateColumns<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `none \| <track-list> \| <auto-track-list> \| subgrid <line-name-list>?` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-------------------------: \| \| **57** \| **52** \| **10.1** \| **16** \| **10** _(-ms-grid-columns)_ \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid-template-columns |
| `gridTemplateRows` | `GridTemplateRows<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `none \| <track-list> \| <auto-track-list> \| subgrid <line-name-list>?` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :----------------------: \| \| **57** \| **52** \| **10.1** \| **16** \| **10** _(-ms-grid-rows)_ \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid-template-rows |
| `hangingPunctuation` | `HangingPunctuation` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| [ first \|\| [ force-end \| allow-end ] \|\| last ]` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :--: \| :-: \| \| No \| No \| **10** \| No \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/hanging-punctuation |
| `height` | `any` | No | - | Sets the height of the box in pixels This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| <length-percentage [0,∞]> \| min-content \| max-content \| fit-content \| fit-content(<length-percentage [0,∞]>) \| <calc-size()> \| <anchor-size()>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/height |
| `hyphenateCharacter` | `HyphenateCharacter` | No | - | Since September 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `auto \| <string>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-------: \| :------: \| :-: \| \| **106** \| **98** \| **17** \| **106** \| No \| \| 6 _-x-_ \| \| 5.1 _-x-_ \| 79 _-x-_ \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/hyphenate-character |
| `hyphenateLimitChars` | `HyphenateLimitChars` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ auto \| <integer> ]{1,3}` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **109** \| **137** \| No \| **109** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/hyphenate-limit-chars |
| `hyphens` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "manual"` | No | - | Since September 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `none \| manual \| auto` **Initial value**: `manual` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :-------: \| :----: \| :----------: \| \| **55** \| **43** \| **17** \| **79** \| **10** _-x-_ \| \| 13 _-x-_ \| 6 _-x-_ \| 5.1 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/hyphens |
| `imageOrientation` | `ImageOrientation` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2020. **Syntax**: `from-image \| <angle> \| [ <angle>? flip ]` **Initial value**: `from-image` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **81** \| **26** \| **13.1** \| **81** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/image-orientation |
| `imageRendering` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "-moz-crisp-edges" \| "-webkit-optimize-contrast" \| "crisp-edges" \| "pixelated" \| "smooth"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `auto \| crisp-edges \| pixelated \| smooth` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **13** \| **3.6** \| **6** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/image-rendering |
| `imageResolution` | `ImageResolution` | No | - | The **`image-resolution`** CSS property specifies the intrinsic resolution of all raster images used in or on the element. It affects content images such as replaced elements and generated content, and decorative images such as `background-image` images. **Syntax**: `[ from-image \|\| <resolution> ] && snap?` **Initial value**: `1dppx` |
| `initialLetter` | `InitialLetter` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `normal \| [ <number> <integer>? ]` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :---------: \| :-----: \| :-: \| \| **110** \| No \| **9** _-x-_ \| **110** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/initial-letter |
| `initialLetterAlign` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "alphabetic" \| "ideographic" \| "hanging"` | No | - | **Syntax**: `[ auto \| alphabetic \| hanging \| ideographic ]` **Initial value**: `auto` |
| `inlineSize` | `InlineSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'width'>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-------------------------: \| :-----: \| :---------------------------: \| :----: \| :-: \| \| **57** \| **41** \| **12.1** \| **79** \| No \| \| 8 _(-webkit-logical-width)_ \| \| 5.1 _(-webkit-logical-width)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/inline-size |
| `insetBlockEnd` | `InsetBlockEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'top'>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **63** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/inset-block-end |
| `insetBlockStart` | `InsetBlockStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'top'>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **63** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/inset-block-start |
| `insetInlineEnd` | `InsetInlineEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'top'>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **63** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/inset-inline-end |
| `insetInlineStart` | `InsetInlineStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'top'>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **63** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/inset-inline-start |
| `interpolateSize` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "allow-keywords" \| "numeric-only"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `numeric-only \| allow-keywords` **Initial value**: `numeric-only` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **129** \| No \| No \| **129** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/interpolate-size |
| `isolation` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "isolate"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `auto \| isolate` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **41** \| **36** \| **8** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/isolation |
| `justifyItems` | `JustifyItems` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2016. **Syntax**: `normal \| stretch \| <baseline-position> \| <overflow-position>? [ <self-position> \| left \| right ] \| legacy \| legacy && [ left \| right \| center ] \| anchor-center` **Initial value**: `legacy` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :----: \| \| **52** \| **20** \| **9** \| **12** \| **11** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/justify-items |
| `justifySelf` | `JustifySelf` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `auto \| normal \| stretch \| <baseline-position> \| <overflow-position>? [ <self-position> \| left \| right ] \| anchor-center` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :----: \| \| **57** \| **45** \| **10.1** \| **16** \| **10** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/justify-self |
| `justifyTracks` | `JustifyTracks` | No | - | **Syntax**: `[ normal \| <content-distribution> \| <overflow-position>? [ <content-position> \| left \| right ] ]#` **Initial value**: `normal` |
| `letterSpacing` | `LetterSpacing<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `normal \| <length>` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/letter-spacing |
| `lightingColor` | `LightingColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<color>` **Initial value**: `white` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-----: \| \| **5** \| **3** \| **6** \| **12** \| **≤11** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/lighting-color |
| `lineBreak` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "strict" \| "anywhere" \| "loose"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `auto \| loose \| normal \| strict \| anywhere` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :-----: \| \| **58** \| **69** \| **11** \| **14** \| **5.5** \| \| 1 _-x-_ \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/line-break |
| `lineHeight` | `LineHeight<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `normal \| <number> \| <length> \| <percentage>` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/line-height |
| `lineHeightStep` | `LineHeightStep<string \| number>` | No | - | The **`line-height-step`** CSS property sets the step unit for line box heights. When the property is set, line box heights are rounded up to the closest multiple of the unit. **Syntax**: `<length>` **Initial value**: `0` |
| `listStyleImage` | `ListStyleImage` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<image> \| none` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/list-style-image |
| `listStylePosition` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inside" \| "outside"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `inside \| outside` **Initial value**: `outside` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/list-style-position |
| `listStyleType` | `ListStyleType` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<counter-style> \| <string> \| none` **Initial value**: `disc` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/list-style-type |
| `marginBlockEnd` | `MarginBlockEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'margin-top'>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/margin-block-end |
| `marginBlockStart` | `MarginBlockStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'margin-top'>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/margin-block-start |
| `marginBottom` | `any` | No | - | Sets margin on the bottom. Accepts a numeric value (multiplied by spacing unit), predefined spacing value (tiny, small, etc.) a spacing token (SP1, SP2, etc.) or a value in pixels This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage> \| auto \| <anchor-size()>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **3** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/margin-bottom |
| `marginInlineEnd` | `MarginInlineEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'margin-top'>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----------------------: \| :-------------------: \| :----------------------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| \| 2 _(-webkit-margin-end)_ \| 3 _(-moz-margin-end)_ \| 3 _(-webkit-margin-end)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/margin-inline-end |
| `marginInlineStart` | `MarginInlineStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'margin-top'>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------------------------: \| :---------------------: \| :------------------------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| \| 2 _(-webkit-margin-start)_ \| 3 _(-moz-margin-start)_ \| 3 _(-webkit-margin-start)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/margin-inline-start |
| `marginLeft` | `any` | No | - | Sets margin on the left. Accepts a numeric value (multiplied by spacing unit), predefined spacing value (tiny, small, etc.) a spacing token (SP1, SP2, etc.) or a value in pixels This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage> \| auto \| <anchor-size()>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **3** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/margin-left |
| `marginRight` | `any` | No | - | Sets margin on the right. Accepts a numeric value (multiplied by spacing unit), predefined spacing value (tiny, small, etc.) a spacing token (SP1, SP2, etc.) or a value in pixels This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage> \| auto \| <anchor-size()>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **3** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/margin-right |
| `marginTop` | `any` | No | - | Sets margin on the top. Accepts a numeric value (multiplied by spacing unit), predefined spacing value (tiny, small, etc.) a spacing token (SP1, SP2, etc.) or a value in pixels This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage> \| auto \| <anchor-size()>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **3** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/margin-top |
| `marginTrim` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "all" \| "in-flow"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| in-flow \| all` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :--: \| :-: \| \| No \| No \| **16.4** \| No \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/margin-trim |
| `marker` | `Marker` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `none \| <url>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **3** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/marker |
| `markerEnd` | `MarkerEnd` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `none \| <url>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **3** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/marker-end |
| `markerMid` | `MarkerMid` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `none \| <url>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **3** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/marker-mid |
| `markerStart` | `MarkerStart` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `none \| <url>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **3** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/marker-start |
| `maskBorderMode` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "alpha" \| "luminance"` | No | - | The **`mask-border-mode`** CSS property specifies the blending mode used in a mask border. **Syntax**: `luminance \| alpha` **Initial value**: `alpha` |
| `maskBorderOutset` | `MaskBorderOutset<string \| number>` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ <length> \| <number> ]{1,4}` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-------------------------------------: \| :-----: \| :-----------------------------------: \| :--------------------------------------: \| :-: \| \| **1** _(-webkit-mask-box-image-outset)_ \| No \| **17.2** \| **79** _(-webkit-mask-box-image-outset)_ \| No \| \| \| \| 3.1 _(-webkit-mask-box-image-outset)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-border-outset |
| `maskBorderRepeat` | `MaskBorderRepeat` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ stretch \| repeat \| round \| space ]{1,2}` **Initial value**: `stretch` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-------------------------------------: \| :-----: \| :-----------------------------------: \| :--------------------------------------: \| :-: \| \| **1** _(-webkit-mask-box-image-repeat)_ \| No \| **17.2** \| **79** _(-webkit-mask-box-image-repeat)_ \| No \| \| \| \| 3.1 _(-webkit-mask-box-image-repeat)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-border-repeat |
| `maskBorderSlice` | `MaskBorderSlice` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `<number-percentage>{1,4} fill?` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------------------------------------: \| :-----: \| :----------------------------------: \| :-------------------------------------: \| :-: \| \| **1** _(-webkit-mask-box-image-slice)_ \| No \| **17.2** \| **79** _(-webkit-mask-box-image-slice)_ \| No \| \| \| \| 3.1 _(-webkit-mask-box-image-slice)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-border-slice |
| `maskBorderSource` | `MaskBorderSource` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| <image>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-------------------------------------: \| :-----: \| :-----------------------------------: \| :--------------------------------------: \| :-: \| \| **1** _(-webkit-mask-box-image-source)_ \| No \| **17.2** \| **79** _(-webkit-mask-box-image-source)_ \| No \| \| \| \| 3.1 _(-webkit-mask-box-image-source)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-border-source |
| `maskBorderWidth` | `MaskBorderWidth<string \| number>` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ <length-percentage> \| <number> \| auto ]{1,4}` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------------------------------------: \| :-----: \| :----------------------------------: \| :-------------------------------------: \| :-: \| \| **1** _(-webkit-mask-box-image-width)_ \| No \| **17.2** \| **79** _(-webkit-mask-box-image-width)_ \| No \| \| \| \| 3.1 _(-webkit-mask-box-image-width)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-border-width |
| `maskClip` | `MaskClip` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `[ <coord-box> \| no-clip ]#` **Initial value**: `border-box` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :------: \| :-: \| \| **120** \| **53** \| **15.4** \| **120** \| No \| \| 1 _-x-_ \| \| 4 _-x-_ \| 79 _-x-_ \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-clip |
| `maskComposite` | `MaskComposite` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<compositing-operator>#` **Initial value**: `add` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :---: \| :-: \| \| **120** \| **53** \| **15.4** \| 18-79 \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-composite |
| `maskImage` | `MaskImage` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<mask-reference>#` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :---: \| :-: \| \| **120** \| **53** \| **15.4** \| 16-79 \| No \| \| 1 _-x-_ \| \| 4 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-image |
| `maskMode` | `MaskMode` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<masking-mode>#` **Initial value**: `match-source` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **120** \| **53** \| **15.4** \| **120** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-mode |
| `maskOrigin` | `MaskOrigin` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<coord-box>#` **Initial value**: `border-box` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :------: \| :-: \| \| **120** \| **53** \| **15.4** \| **120** \| No \| \| 1 _-x-_ \| \| 4 _-x-_ \| 79 _-x-_ \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-origin |
| `maskPosition` | `MaskPosition<string \| number>` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<position>#` **Initial value**: `0% 0%` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-------: \| :---: \| :-: \| \| **120** \| **53** \| **15.4** \| 18-79 \| No \| \| 1 _-x-_ \| \| 3.1 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-position |
| `maskRepeat` | `MaskRepeat` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<repeat-style>#` **Initial value**: `repeat` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-------: \| :---: \| :-: \| \| **120** \| **53** \| **15.4** \| 18-79 \| No \| \| 1 _-x-_ \| \| 3.1 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-repeat |
| `maskSize` | `MaskSize<string \| number>` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<bg-size>#` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :---: \| :-: \| \| **120** \| **53** \| **15.4** \| 18-79 \| No \| \| 4 _-x-_ \| \| 4 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-size |
| `maskType` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "alpha" \| "luminance"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `luminance \| alpha` **Initial value**: `luminance` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **24** \| **35** \| **7** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-type |
| `masonryAutoFlow` | `MasonryAutoFlow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `[ pack \| next ] \|\| [ definite-first \| ordered ]` **Initial value**: `pack` |
| `mathDepth` | `MathDepth` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `auto-add \| add(<integer>) \| <integer>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **109** \| **117** \| No \| **109** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/math-depth |
| `mathShift` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "compact"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `normal \| compact` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **109** \| No \| No \| **109** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/math-shift |
| `mathStyle` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "compact"` | No | - | Since August 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `normal \| compact` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **109** \| **117** \| **14.1** \| **109** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/math-style |
| `maxBlockSize` | `MaxBlockSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'max-width'>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/max-block-size |
| `maxHeight` | `any` | No | - | Sets the maximum height of the box in pixels This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `none \| <length-percentage [0,∞]> \| min-content \| max-content \| fit-content \| fit-content(<length-percentage [0,∞]>) \| <calc-size()> \| <anchor-size()>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :---: \| \| **1** \| **1** \| **1.3** \| **12** \| **7** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/max-height |
| `maxInlineSize` | `MaxInlineSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'max-width'>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :--------: \| :----: \| :-: \| \| **57** \| **41** \| **12.1** \| **79** \| No \| \| \| \| 10.1 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/max-inline-size |
| `maxLines` | `MaxLines` | No | - | **Syntax**: `none \| <integer>` **Initial value**: `none` |
| `minBlockSize` | `MinBlockSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'min-width'>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/min-block-size |
| `minInlineSize` | `MinInlineSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'min-width'>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/min-inline-size |
| `minWidth` | `any` | No | - | Sets the minimum width of the box in pixels This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| <length-percentage [0,∞]> \| min-content \| max-content \| fit-content \| fit-content(<length-percentage [0,∞]>) \| <calc-size()> \| <anchor-size()>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **7** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/min-width |
| `mixBlendMode` | `"overlay" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "color" \| "normal" \| "color-burn" \| "color-dodge" \| "darken" \| "difference" \| "exclusion" \| "hard-light" \| "hue" \| "lighten" \| "luminosity" \| "multiply" \| "saturation" \| "screen" \| "soft-light" \| "plus-darker" \| "plus-lighter"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<blend-mode> \| plus-darker \| plus-lighter` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **41** \| **32** \| **8** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mix-blend-mode |
| `motionDistance` | `OffsetDistance<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022. **Syntax**: `<length-percentage>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :--------------------: \| :-----: \| :----: \| :----: \| :-: \| \| **55** \| **72** \| **16** \| **79** \| No \| \| 46 _(motion-distance)_ \| \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/offset-distance |
| `motionPath` | `OffsetPath` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `none \| <offset-path> \|\| <coord-box>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----------------: \| :-----: \| :------: \| :----: \| :-: \| \| **55** \| **72** \| **15.4** \| **79** \| No \| \| 46 _(motion-path)_ \| \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/offset-path |
| `motionRotation` | `OffsetRotate` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022. **Syntax**: `[ auto \| reverse ] \|\| <angle>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :--------------------: \| :-----: \| :----: \| :----: \| :-: \| \| **56** \| **72** \| **16** \| **79** \| No \| \| 46 _(motion-rotation)_ \| \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/offset-rotate |
| `objectFit` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "fill" \| "contain" \| "cover" \| "scale-down"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `fill \| contain \| cover \| none \| scale-down` **Initial value**: `fill` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **32** \| **36** \| **10** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/object-fit |
| `objectPosition` | `ObjectPosition<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<position>` **Initial value**: `50% 50%` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **32** \| **36** \| **10** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/object-position |
| `objectViewBox` | `ObjectViewBox` | No | - | **Syntax**: `none \| <basic-shape-rect>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **104** \| No \| No \| **104** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/object-view-box |
| `offsetAnchor` | `OffsetAnchor<string \| number>` | No | - | Since August 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `auto \| <position>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **116** \| **72** \| **16** \| **116** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/offset-anchor |
| `offsetDistance` | `OffsetDistance<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022. **Syntax**: `<length-percentage>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :--------------------: \| :-----: \| :----: \| :----: \| :-: \| \| **55** \| **72** \| **16** \| **79** \| No \| \| 46 _(motion-distance)_ \| \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/offset-distance |
| `offsetPath` | `OffsetPath` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `none \| <offset-path> \|\| <coord-box>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----------------: \| :-----: \| :------: \| :----: \| :-: \| \| **55** \| **72** \| **15.4** \| **79** \| No \| \| 46 _(motion-path)_ \| \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/offset-path |
| `offsetPosition` | `OffsetPosition<string \| number>` | No | - | Since January 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `normal \| auto \| <position>` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **116** \| **122** \| **16** \| **116** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/offset-position |
| `offsetRotate` | `OffsetRotate` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022. **Syntax**: `[ auto \| reverse ] \|\| <angle>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :--------------------: \| :-----: \| :----: \| :----: \| :-: \| \| **56** \| **72** \| **16** \| **79** \| No \| \| 46 _(motion-rotation)_ \| \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/offset-rotate |
| `offsetRotation` | `OffsetRotate` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022. **Syntax**: `[ auto \| reverse ] \|\| <angle>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :--------------------: \| :-----: \| :----: \| :----: \| :-: \| \| **56** \| **72** \| **16** \| **79** \| No \| \| 46 _(motion-rotation)_ \| \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/offset-rotate |
| `opacity` | `Opacity` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<opacity-value>` **Initial value**: `1` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **2** \| **12** \| **9** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/opacity |
| `order` | `Order` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<integer>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :-----: \| :----: \| :------: \| \| **29** \| **20** \| **9** \| **12** \| **11** \| \| 21 _-x-_ \| \| 7 _-x-_ \| \| 10 _-x-_ \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/order |
| `orphans` | `Orphans` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `<integer>` **Initial value**: `2` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :---: \| \| **25** \| No \| **1.3** \| **12** \| **8** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/orphans |
| `outlineColor` | `OutlineColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| <color>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :---: \| \| **1** \| **1.5** \| **1.2** \| **12** \| **8** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/outline-color |
| `outlineOffset` | `OutlineOffset<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `<length>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :-: \| \| **1** \| **1.5** \| **1.2** \| **15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/outline-offset |
| `outlineStyle` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inset" \| "dashed" \| "dotted" \| "double" \| "groove" \| "outset" \| "ridge" \| "solid"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| <outline-line-style>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :---: \| \| **1** \| **1.5** \| **1.2** \| **12** \| **8** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/outline-style |
| `outlineWidth` | `OutlineWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-width>` **Initial value**: `medium` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :---: \| \| **1** \| **1.5** \| **1.2** \| **12** \| **8** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/outline-width |
| `overflowAnchor` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `auto \| none` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :---------: \| :----: \| :-: \| \| **56** \| **66** \| **preview** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/overflow-anchor |
| `overflowBlock` | `"visible" \| "hidden" \| "scroll" \| "auto" \| "clip" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | Since September 2025, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `visible \| hidden \| clip \| scroll \| auto` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **135** \| **69** \| **26** \| **135** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/overflow-block |
| `overflowClipBox` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "content-box" \| "padding-box"` | No | - | **Syntax**: `padding-box \| content-box` **Initial value**: `padding-box` |
| `overflowClipMargin` | `OverflowClipMargin<string \| number>` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `<visual-box> \|\| <length [0,∞]>` **Initial value**: `0px` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **90** \| **102** \| No \| **90** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/overflow-clip-margin |
| `overflowInline` | `"visible" \| "hidden" \| "scroll" \| "auto" \| "clip" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | Since September 2025, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `visible \| hidden \| clip \| scroll \| auto` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **135** \| **69** \| **26** \| **135** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/overflow-inline |
| `overflowWrap` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "anywhere" \| "break-word"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2018. **Syntax**: `normal \| break-word \| anywhere` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-------------: \| :---------------: \| :-------------: \| :--------------: \| :-------------------: \| \| **23** \| **49** \| **7** \| **18** \| **5.5** _(word-wrap)_ \| \| 1 _(word-wrap)_ \| 3.5 _(word-wrap)_ \| 1 _(word-wrap)_ \| 12 _(word-wrap)_ \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/overflow-wrap |
| `overflowX` | `"visible" \| "hidden" \| "scroll" \| "auto" \| "overlay" \| "clip" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "-moz-hidden-unscrollable"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `visible \| hidden \| clip \| scroll \| auto` **Initial value**: `visible` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **3.5** \| **3** \| **12** \| **5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/overflow-x |
| `overflowY` | `"visible" \| "hidden" \| "scroll" \| "auto" \| "overlay" \| "clip" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "-moz-hidden-unscrollable"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `visible \| hidden \| clip \| scroll \| auto` **Initial value**: `visible` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **3.5** \| **3** \| **12** \| **5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/overflow-y |
| `overscrollBehaviorBlock` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "contain"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022. **Syntax**: `contain \| none \| auto` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **77** \| **73** \| **16** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/overscroll-behavior-block |
| `overscrollBehaviorInline` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "contain"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022. **Syntax**: `contain \| none \| auto` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **77** \| **73** \| **16** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/overscroll-behavior-inline |
| `overscrollBehaviorX` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "contain"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022. **Syntax**: `contain \| none \| auto` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **63** \| **59** \| **16** \| **18** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/overscroll-behavior-x |
| `overscrollBehaviorY` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "contain"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022. **Syntax**: `contain \| none \| auto` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **63** \| **59** \| **16** \| **18** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/overscroll-behavior-y |
| `paddingBlockEnd` | `PaddingBlockEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'padding-top'>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/padding-block-end |
| `paddingBlockStart` | `PaddingBlockStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'padding-top'>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/padding-block-start |
| `paddingBottom` | `any` | No | - | Sets padding on the bottom. Accepts a numeric value (multiplied by spacing unit), predefined spacing value (tiny, small, etc.) a spacing token (SP1, SP2, etc.) or a value in pixels This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/padding-bottom |
| `paddingInlineEnd` | `PaddingInlineEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'padding-top'>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----------------------: \| :--------------------: \| :-----------------------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| \| 2 _(-webkit-padding-end)_ \| 3 _(-moz-padding-end)_ \| 3 _(-webkit-padding-end)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/padding-inline-end |
| `paddingInlineStart` | `PaddingInlineStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'padding-top'>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-------------------------: \| :----------------------: \| :-------------------------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| \| 2 _(-webkit-padding-start)_ \| 3 _(-moz-padding-start)_ \| 3 _(-webkit-padding-start)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/padding-inline-start |
| `paddingLeft` | `any` | No | - | Sets padding on the left. Accepts a numeric value (multiplied by spacing unit), predefined spacing value (tiny, small, etc.) a spacing token (SP1, SP2, etc.) or a value in pixels This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/padding-left |
| `paddingRight` | `any` | No | - | Sets padding on the right. Accepts a numeric value (multiplied by spacing unit), predefined spacing value (tiny, small, etc.) a spacing token (SP1, SP2, etc.) or a value in pixels This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/padding-right |
| `paddingTop` | `any` | No | - | Sets padding on the top. Accepts a numeric value (multiplied by spacing unit), predefined spacing value (tiny, small, etc.) a spacing token (SP1, SP2, etc.) or a value in pixels This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/padding-top |
| `paintOrder` | `PaintOrder` | No | - | Since March 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `normal \| [ fill \|\| stroke \|\| markers ]` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **123** \| **60** \| **11** \| **123** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/paint-order |
| `perspective` | `Perspective<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| <length>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :------: \| :-----: \| :----: \| :----: \| \| **36** \| **16** \| **9** \| **12** \| **10** \| \| 12 _-x-_ \| 10 _-x-_ \| 4 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/perspective |
| `perspectiveOrigin` | `PerspectiveOrigin<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<position>` **Initial value**: `50% 50%` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :------: \| :-----: \| :----: \| :----: \| \| **36** \| **16** \| **9** \| **12** \| **10** \| \| 12 _-x-_ \| 10 _-x-_ \| 4 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/perspective-origin |
| `pointerEvents` | `"visible" \| "auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "fill" \| "stroke" \| "all" \| "painted" \| "visibleFill" \| "visiblePainted" \| "visibleStroke"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| none \| visiblePainted \| visibleFill \| visibleStroke \| visible \| painted \| fill \| stroke \| all \| inherit` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :----: \| \| **1** \| **1.5** \| **4** \| **12** \| **11** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/pointer-events |
| `position` | `"fixed" \| "sticky" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "-webkit-sticky" \| "absolute" \| "relative" \| "static"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `static \| relative \| absolute \| sticky \| fixed` **Initial value**: `static` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/position |
| `positionAnchor` | `PositionAnchor` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `auto \| <anchor-name>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :---------: \| :----: \| :-----: \| :-: \| \| **125** \| **preview** \| **26** \| **125** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/position-anchor |
| `positionArea` | `PositionArea` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| <position-area>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :---------: \| :----: \| :-----: \| :-: \| \| **129** \| **preview** \| **26** \| **129** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/position-area |
| `positionTryFallbacks` | `PositionTryFallbacks` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| [ [<dashed-ident> \|\| <try-tactic>] \| <'position-area'> ]#` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :---------: \| :----: \| :-----: \| :-: \| \| **128** \| **preview** \| **26** \| **128** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/position-try-fallbacks |
| `positionTryOrder` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "most-block-size" \| "most-height" \| "most-inline-size" \| "most-width"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `normal \| <try-size>` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **125** \| No \| **26** \| **125** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/position-try-order |
| `positionVisibility` | `PositionVisibility` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `always \| [ anchors-valid \|\| anchors-visible \|\| no-overflow ]` **Initial value**: `anchors-visible` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :---------: \| :----: \| :-----: \| :-: \| \| **125** \| **preview** \| No \| **125** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/position-visibility |
| `printColorAdjust` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "economy" \| "exact"` | No | - | Since May 2025, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `economy \| exact` **Initial value**: `economy` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----------------: \| :------: \| :------: \| :-: \| \| **136** \| **97** \| **15.4** \| **136** \| No \| \| 17 _-x-_ \| 48 _(color-adjust)_ \| 6 _-x-_ \| 79 _-x-_ \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/print-color-adjust |
| `quotes` | `Quotes` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| auto \| [ <string> <string> ]+` **Initial value**: depends on user agent \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **11** \| **1.5** \| **9** \| **12** \| **8** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/quotes |
| `r` | `R<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `<length> \| <percentage>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **43** \| **69** \| **9** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/r |
| `resize` | `"none" \| "inline" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "horizontal" \| "vertical" \| "both" \| "block"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| both \| horizontal \| vertical \| block \| inline` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **1** \| **4** \| **3** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/resize |
| `rotate` | `Rotate` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since August 2022. **Syntax**: `none \| <angle> \| [ x \| y \| z \| <number>{3} ] && <angle>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **104** \| **72** \| **14.1** \| **104** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/rotate |
| `rowGap` | `RowGap<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `normal \| <length-percentage>` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **47** \| **52** \| **10.1** \| **16** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/row-gap |
| `rubyAlign` | `"start" \| "center" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "space-between" \| "space-around"` | No | - | Since December 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `start \| center \| space-between \| space-around` **Initial value**: `space-around` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **128** \| **38** \| **18.2** \| **128** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/ruby-align |
| `rubyMerge` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "collapse" \| "separate"` | No | - | **Syntax**: `separate \| collapse \| auto` **Initial value**: `separate` |
| `rubyOverhang` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | **Syntax**: `auto \| none` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :--: \| :-: \| \| No \| No \| **18.2** \| No \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/ruby-overhang |
| `rubyPosition` | `RubyPosition` | No | - | Since December 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `[ alternate \|\| [ over \| under ] ] \| inter-character` **Initial value**: `alternate` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :---: \| :-: \| \| **84** \| **38** \| **18.2** \| 12-79 \| No \| \| 1 _-x-_ \| \| 7 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/ruby-position |
| `rx` | `Rx<string \| number>` | No | - | Since March 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<length> \| <percentage>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **43** \| **69** \| **17.4** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/rx |
| `ry` | `Ry<string \| number>` | No | - | Since March 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<length> \| <percentage>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **43** \| **69** \| **17.4** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/ry |
| `scale` | `Scale` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since August 2022. **Syntax**: `none \| [ <number> \| <percentage> ]{1,3}` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **104** \| **72** \| **14.1** \| **104** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scale |
| `scrollBehavior` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "smooth"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `auto \| smooth` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **61** \| **36** \| **15.4** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-behavior |
| `scrollInitialTarget` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "nearest"` | No | - | **Syntax**: `none \| nearest` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **133** \| No \| No \| **133** \| No \| |
| `scrollMarginBlockEnd` | `ScrollMarginBlockEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `<length>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **69** \| **68** \| **15** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin-block-end |
| `scrollMarginBlockStart` | `ScrollMarginBlockStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `<length>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **69** \| **68** \| **15** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin-block-start |
| `scrollMarginBottom` | `ScrollMarginBottom<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<length>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------------------------------: \| :----: \| :-: \| \| **69** \| **68** \| **14.1** \| **79** \| No \| \| \| \| 11 _(scroll-snap-margin-bottom)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin-bottom |
| `scrollMarginInlineEnd` | `ScrollMarginInlineEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `<length>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **69** \| **68** \| **15** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin-inline-end |
| `scrollMarginInlineStart` | `ScrollMarginInlineStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `<length>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **69** \| **68** \| **15** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin-inline-start |
| `scrollMarginLeft` | `ScrollMarginLeft<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<length>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----------------------------: \| :----: \| :-: \| \| **69** \| **68** \| **14.1** \| **79** \| No \| \| \| \| 11 _(scroll-snap-margin-left)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin-left |
| `scrollMarginRight` | `ScrollMarginRight<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<length>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----------------------------: \| :----: \| :-: \| \| **69** \| **68** \| **14.1** \| **79** \| No \| \| \| \| 11 _(scroll-snap-margin-right)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin-right |
| `scrollMarginTop` | `ScrollMarginTop<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<length>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :---------------------------: \| :----: \| :-: \| \| **69** \| **68** \| **14.1** \| **79** \| No \| \| \| \| 11 _(scroll-snap-margin-top)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin-top |
| `scrollPaddingBlockEnd` | `ScrollPaddingBlockEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `auto \| <length-percentage>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **69** \| **68** \| **15** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-padding-block-end |
| `scrollPaddingBlockStart` | `ScrollPaddingBlockStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `auto \| <length-percentage>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **69** \| **68** \| **15** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-padding-block-start |
| `scrollPaddingBottom` | `ScrollPaddingBottom<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `auto \| <length-percentage>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **68** \| **14.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-padding-bottom |
| `scrollPaddingInlineEnd` | `ScrollPaddingInlineEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `auto \| <length-percentage>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **69** \| **68** \| **15** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-padding-inline-end |
| `scrollPaddingInlineStart` | `ScrollPaddingInlineStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `auto \| <length-percentage>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **69** \| **68** \| **15** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-padding-inline-start |
| `scrollPaddingLeft` | `ScrollPaddingLeft<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `auto \| <length-percentage>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **68** \| **14.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-padding-left |
| `scrollPaddingRight` | `ScrollPaddingRight<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `auto \| <length-percentage>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **68** \| **14.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-padding-right |
| `scrollPaddingTop` | `ScrollPaddingTop<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `auto \| <length-percentage>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **68** \| **14.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-padding-top |
| `scrollSnapAlign` | `ScrollSnapAlign` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `[ none \| start \| end \| center ]{1,2}` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **69** \| **68** \| **11** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-snap-align |
| `scrollSnapMarginBottom` | `ScrollMarginBottom<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<length>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------------------------------: \| :----: \| :-: \| \| **69** \| **68** \| **14.1** \| **79** \| No \| \| \| \| 11 _(scroll-snap-margin-bottom)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin-bottom |
| `scrollSnapMarginLeft` | `ScrollMarginLeft<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<length>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----------------------------: \| :----: \| :-: \| \| **69** \| **68** \| **14.1** \| **79** \| No \| \| \| \| 11 _(scroll-snap-margin-left)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin-left |
| `scrollSnapMarginRight` | `ScrollMarginRight<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<length>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----------------------------: \| :----: \| :-: \| \| **69** \| **68** \| **14.1** \| **79** \| No \| \| \| \| 11 _(scroll-snap-margin-right)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin-right |
| `scrollSnapMarginTop` | `ScrollMarginTop<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<length>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :---------------------------: \| :----: \| :-: \| \| **69** \| **68** \| **14.1** \| **79** \| No \| \| \| \| 11 _(scroll-snap-margin-top)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin-top |
| `scrollSnapStop` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "always"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2022. **Syntax**: `normal \| always` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **75** \| **103** \| **15** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-snap-stop |
| `scrollSnapType` | `ScrollSnapType` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2022. **Syntax**: `none \| [ x \| y \| block \| inline \| both ] [ mandatory \| proximity ]?` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :----------: \| \| **69** \| 39-68 \| **11** \| **79** \| **10** _-x-_ \| \| \| \| 9 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-snap-type |
| `scrollTimelineAxis` | `ScrollTimelineAxis` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ block \| inline \| x \| y ]#` **Initial value**: `block` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **115** \| No \| **26** \| **115** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-timeline-axis |
| `scrollTimelineName` | `ScrollTimelineName` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ none \| <dashed-ident> ]#` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **115** \| No \| **26** \| **115** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-timeline-name |
| `scrollbarColor` | `ScrollbarColor` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `auto \| <color>{2}` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **121** \| **64** \| No \| **121** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scrollbar-color |
| `scrollbarGutter` | `ScrollbarGutter` | No | - | Since December 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `auto \| stable && both-edges?` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **94** \| **97** \| **18.2** \| **94** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scrollbar-gutter |
| `scrollbarWidth` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "thin"` | No | - | Since December 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `auto \| thin \| none` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **121** \| **64** \| **18.2** \| **121** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scrollbar-width |
| `shapeImageThreshold` | `ShapeImageThreshold` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<opacity-value>` **Initial value**: `0.0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **37** \| **62** \| **10.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/shape-image-threshold |
| `shapeMargin` | `ShapeMargin<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<length-percentage>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **37** \| **62** \| **10.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/shape-margin |
| `shapeOutside` | `ShapeOutside` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `none \| [ <shape-box> \|\| <basic-shape> ] \| <image>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **37** \| **62** \| **10.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/shape-outside |
| `shapeRendering` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "crispEdges" \| "geometricPrecision" \| "optimizeSpeed"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `auto \| optimizeSpeed \| crispEdges \| geometricPrecision` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **1** \| **3** \| **4** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/shape-rendering |
| `speakAs` | `SpeakAs` | No | - | **Syntax**: `normal \| spell-out \|\| digits \|\| [ literal-punctuation \| no-punctuation ]` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :--: \| :-: \| \| No \| No \| **11.1** \| No \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/speak-as |
| `stopColor` | `StopColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `<'color'>` **Initial value**: `black` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **3** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/stop-color |
| `stopOpacity` | `StopOpacity` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `<'opacity'>` **Initial value**: `black` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **3** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/stop-opacity |
| `stroke` | `Stroke` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `<paint>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **1.5** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/stroke |
| `strokeColor` | `StrokeColor` | No | - | **Syntax**: `<color>` **Initial value**: `transparent` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :--: \| :-: \| \| No \| No \| **11.1** \| No \| No \| |
| `strokeDasharray` | `StrokeDasharray<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `none \| <dasharray>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **1.5** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/stroke-dasharray |
| `strokeDashoffset` | `StrokeDashoffset<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `<length-percentage> \| <number>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **1.5** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/stroke-dashoffset |
| `strokeLinecap` | `"round" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "butt" \| "square"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `butt \| round \| square` **Initial value**: `butt` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **1.5** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/stroke-linecap |
| `strokeLinejoin` | `"round" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "arcs" \| "bevel" \| "miter" \| "miter-clip"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `miter \| miter-clip \| round \| bevel \| arcs` **Initial value**: `miter` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **1.5** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/stroke-linejoin |
| `strokeMiterlimit` | `StrokeMiterlimit` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `<number>` **Initial value**: `4` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **1.5** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/stroke-miterlimit |
| `strokeOpacity` | `StrokeOpacity` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `<'opacity'>` **Initial value**: `1` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **1.5** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/stroke-opacity |
| `strokeWidth` | `StrokeWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `<length-percentage> \| <number>` **Initial value**: `1px` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **1.5** \| **4** \| **≤15** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/stroke-width |
| `tabSize` | `TabSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since August 2021. **Syntax**: `<integer> \| <length>` **Initial value**: `8` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **21** \| **91** \| **7** \| **79** \| No \| \| \| 4 _-x-_ \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/tab-size |
| `tableLayout` | `"fixed" \| "auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| fixed` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **14** \| **1** \| **1** \| **12** \| **5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/table-layout |
| `textAlign` | `"right" \| "left" \| "start" \| "center" \| "end" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "-khtml-center" \| "-khtml-left" \| "-khtml-right" \| "-moz-center" \| "-moz-left" \| "-moz-right" \| "-webkit-center" \| "-webkit-left" \| "-webkit-match-parent" \| "-webkit-right" \| "justify" \| "match-parent"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `start \| end \| left \| right \| center \| justify \| match-parent` **Initial value**: `start`, or a nameless value that acts as `left` if _direction_ is `ltr`, `right` if _direction_ is `rtl` if `start` is not supported by the browser. \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **3** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-align |
| `textAlignLast` | `"auto" \| "right" \| "left" \| "start" \| "center" \| "end" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "justify"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022. **Syntax**: `auto \| start \| end \| left \| right \| center \| justify` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-----: \| \| **47** \| **49** \| **16** \| **12** \| **5.5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-align-last |
| `textAnchor` | `"start" \| "end" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "middle"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since August 2016. **Syntax**: `start \| middle \| end` **Initial value**: `start` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :-----: \| :-: \| \| **1** \| **3** \| **4** \| **≤14** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-anchor |
| `textAutospace` | `TextAutospace` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `normal \| <autospace> \| auto` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **140** \| **145** \| **18.4** \| **140** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-autospace |
| `textBox` | `TextBox` | No | - | **Syntax**: `normal \| <'text-box-trim'> \|\| <'text-box-edge'>` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **133** \| No \| **18.2** \| **133** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-box |
| `textBoxEdge` | `TextBoxEdge` | No | - | **Syntax**: `auto \| <text-edge>` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **133** \| No \| **18.2** \| **133** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-box-edge |
| `textBoxTrim` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "trim-both" \| "trim-end" \| "trim-start"` | No | - | **Syntax**: `none \| trim-start \| trim-end \| trim-both` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **133** \| No \| **18.2** \| **133** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-box-trim |
| `textCombineUpright` | `TextCombineUpright` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `none \| all \| [ digits <integer>? ]` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------------------------: \| :-----: \| :--------------------------: \| :----: \| :------------------------------------: \| \| **48** \| **48** \| **15.4** \| **79** \| **11** _(-ms-text-combine-horizontal)_ \| \| 9 _(-webkit-text-combine)_ \| \| 5.1 _(-webkit-text-combine)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-combine-upright |
| `textDecorationColor` | `TextDecorationColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<color>` **Initial value**: `currentcolor` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **36** \| **12.1** \| **79** \| No \| \| \| \| 8 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-decoration-color |
| `textDecorationLine` | `TextDecorationLine` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `none \| [ underline \|\| overline \|\| line-through \|\| blink ] \| spelling-error \| grammar-error` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **36** \| **12.1** \| **79** \| No \| \| \| \| 8 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-decoration-line |
| `textDecorationSkip` | `TextDecorationSkip` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| [ objects \|\| [ spaces \| [ leading-spaces \|\| trailing-spaces ] ] \|\| edges \|\| box-decoration ]` **Initial value**: `objects` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :--: \| :-: \| \| 57-64 \| No \| **12.1** \| No \| No \| \| \| \| 7 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-decoration-skip |
| `textDecorationSkipInk` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "all"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `auto \| all \| none` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **64** \| **70** \| **15.4** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-decoration-skip-ink |
| `textDecorationStyle` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "dashed" \| "dotted" \| "double" \| "solid" \| "wavy"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `solid \| double \| dotted \| dashed \| wavy` **Initial value**: `solid` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **36** \| **12.1** \| **79** \| No \| \| \| \| 8 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-decoration-style |
| `textDecorationThickness` | `TextDecorationThickness<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2021. **Syntax**: `auto \| from-font \| <length> \| <percentage> ` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **89** \| **70** \| **12.1** \| **89** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-decoration-thickness |
| `textEmphasisColor` | `TextEmphasisColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `<color>` **Initial value**: `currentcolor` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :----: \| :------: \| :-: \| \| **99** \| **46** \| **7** \| **99** \| No \| \| 25 _-x-_ \| \| \| 79 _-x-_ \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-emphasis-color |
| `textEmphasisPosition` | `TextEmphasisPosition` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `auto \| [ over \| under ] && [ right \| left ]?` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :----: \| :------: \| :-: \| \| **99** \| **46** \| **7** \| **99** \| No \| \| 25 _-x-_ \| \| \| 79 _-x-_ \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-emphasis-position |
| `textEmphasisStyle` | `TextEmphasisStyle` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `none \| [ [ filled \| open ] \|\| [ dot \| circle \| double-circle \| triangle \| sesame ] ] \| <string>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :----: \| :------: \| :-: \| \| **99** \| **46** \| **7** \| **99** \| No \| \| 25 _-x-_ \| \| \| 79 _-x-_ \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-emphasis-style |
| `textIndent` | `TextIndent<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage> && hanging? && each-line?` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **3** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-indent |
| `textJustify` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inter-character" \| "distribute" \| "inter-word"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `auto \| inter-character \| inter-word \| none` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :---: \| :----: \| \| No \| **55** \| No \| 12-79 \| **11** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-justify |
| `textOrientation` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "mixed" \| "sideways" \| "sideways-right" \| "upright"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2020. **Syntax**: `mixed \| upright \| sideways` **Initial value**: `mixed` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :-------: \| :----: \| :-: \| \| **48** \| **41** \| **14** \| **79** \| No \| \| 12 _-x-_ \| \| 5.1 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-orientation |
| `textRendering` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "geometricPrecision" \| "optimizeSpeed" \| "optimizeLegibility"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `auto \| optimizeSpeed \| optimizeLegibility \| geometricPrecision` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **4** \| **1** \| **5** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-rendering |
| `textShadow` | `TextShadow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `none \| <shadow-t>#` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :----: \| \| **2** \| **3.5** \| **1.1** \| **12** \| **10** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-shadow |
| `textSizeAdjust` | `TextSizeAdjust` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| auto \| <percentage>` **Initial value**: `auto` for smartphone browsers supporting inflation, `none` in other cases (and then not modifiable). \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **54** \| No \| No \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-size-adjust |
| `textSpacingTrim` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "trim-start" \| "space-all" \| "space-first"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `space-all \| normal \| space-first \| trim-start` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **123** \| No \| No \| **123** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-spacing-trim |
| `textTransform` | `TextTransform` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `none \| [ capitalize \| uppercase \| lowercase ] \|\| full-width \|\| full-size-kana \| math-auto` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-transform |
| `textUnderlineOffset` | `TextUnderlineOffset<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since November 2020. **Syntax**: `auto \| <length> \| <percentage> ` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **70** \| **12.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-underline-offset |
| `textUnderlinePosition` | `TextUnderlinePosition` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `auto \| from-font \| [ under \|\| [ left \| right ] ]` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :---: \| \| **33** \| **74** \| **12.1** \| **12** \| **6** \| \| \| \| 9 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-underline-position |
| `textWrapMode` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "nowrap" \| "wrap"` | No | - | Since October 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `wrap \| nowrap` **Initial value**: `wrap` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **130** \| **124** \| **17.4** \| **130** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-wrap-mode |
| `textWrapStyle` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "balance" \| "stable" \| "pretty"` | No | - | Since October 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `auto \| balance \| stable \| pretty` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **130** \| **124** \| **17.5** \| **130** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-wrap-style |
| `timelineScope` | `TimelineScope` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| <dashed-ident>#` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **116** \| No \| **26** \| **116** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/timeline-scope |
| `touchAction` | `TouchAction` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2019. **Syntax**: `auto \| none \| [ [ pan-x \| pan-left \| pan-right ] \|\| [ pan-y \| pan-up \| pan-down ] \|\| pinch-zoom ] \| manipulation` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :------: \| \| **36** \| **52** \| **13** \| **12** \| **11** \| \| \| \| \| \| 10 _-x-_ \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/touch-action |
| `transform` | `Transform` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| <transform-list>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-------: \| :-------: \| :----: \| :-----: \| \| **36** \| **16** \| **9** \| **12** \| **10** \| \| 1 _-x-_ \| 3.5 _-x-_ \| 3.1 _-x-_ \| \| 9 _-x-_ \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/transform |
| `transformBox` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "border-box" \| "content-box" \| "fill-box" \| "stroke-box" \| "view-box"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `content-box \| border-box \| fill-box \| stroke-box \| view-box` **Initial value**: `view-box` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **64** \| **55** \| **11** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/transform-box |
| `transformOrigin` | `TransformOrigin<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `[ <length-percentage> \| left \| center \| right \| top \| bottom ] \| [ [ <length-percentage> \| left \| center \| right ] && [ <length-percentage> \| top \| center \| bottom ] ] <length>?` **Initial value**: `50% 50% 0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-------: \| :-----: \| :----: \| :-----: \| \| **36** \| **16** \| **9** \| **12** \| **10** \| \| 1 _-x-_ \| 3.5 _-x-_ \| 2 _-x-_ \| \| 9 _-x-_ \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/transform-origin |
| `transformStyle` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "flat" \| "preserve-3d"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `flat \| preserve-3d` **Initial value**: `flat` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :------: \| :-----: \| :----: \| :-: \| \| **36** \| **16** \| **9** \| **12** \| No \| \| 12 _-x-_ \| 10 _-x-_ \| 4 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/transform-style |
| `transitionBehavior` | `TransitionBehavior` | No | - | Since August 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<transition-behavior-value>#` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **117** \| **129** \| **17.4** \| **117** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/transition-behavior |
| `transitionDelay` | `TransitionDelay<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<time>#` **Initial value**: `0s` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **26** \| **16** \| **9** \| **12** \| **10** \| \| 1 _-x-_ \| \| 4 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/transition-delay |
| `transitionDuration` | `TransitionDuration<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<time>#` **Initial value**: `0s` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-------: \| :----: \| :----: \| \| **26** \| **16** \| **9** \| **12** \| **10** \| \| 1 _-x-_ \| \| 3.1 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/transition-duration |
| `transitionProperty` | `TransitionProperty` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| <single-transition-property>#` **Initial value**: all \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-------: \| :----: \| :----: \| \| **26** \| **16** \| **9** \| **12** \| **10** \| \| 1 _-x-_ \| \| 3.1 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/transition-property |
| `transitionTimingFunction` | `TransitionTimingFunction` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<easing-function>#` **Initial value**: `ease` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-------: \| :----: \| :----: \| \| **26** \| **16** \| **9** \| **12** \| **10** \| \| 1 _-x-_ \| \| 3.1 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/transition-timing-function |
| `translate` | `Translate<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since August 2022. **Syntax**: `none \| <length-percentage> [ <length-percentage> <length>? ]?` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **104** \| **72** \| **14.1** \| **104** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/translate |
| `unicodeBidi` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "isolate" \| "-moz-isolate" \| "-moz-isolate-override" \| "-moz-plaintext" \| "-webkit-isolate" \| "-webkit-isolate-override" \| "-webkit-plaintext" \| "bidi-override" \| "embed" \| "isolate-override" \| "plaintext"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `normal \| embed \| isolate \| bidi-override \| isolate-override \| plaintext` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :-----: \| \| **2** \| **1** \| **1.3** \| **12** \| **5.5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/unicode-bidi |
| `userSelect` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "text" \| "all" \| "-moz-none"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `auto \| text \| none \| all` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :---------: \| :------: \| :----------: \| \| **54** \| **69** \| **3** _-x-_ \| **79** \| **10** _-x-_ \| \| 1 _-x-_ \| 1 _-x-_ \| \| 12 _-x-_ \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/user-select |
| `vectorEffect` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "fixed-position" \| "non-rotation" \| "non-scaling-size" \| "non-scaling-stroke"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `none \| non-scaling-stroke \| non-scaling-size \| non-rotation \| fixed-position` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :-: \| \| **6** \| **15** \| **5.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/vector-effect |
| `verticalAlign` | `"top" \| "bottom" \| "middle" \| "space-between"` | No | - | Defines how the children are aligned according to the Y axis This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `baseline \| sub \| super \| text-top \| text-bottom \| middle \| top \| bottom \| <percentage> \| <length>` **Initial value**: `baseline` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/vertical-align |
| `viewTimelineAxis` | `ViewTimelineAxis` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ block \| inline \| x \| y ]#` **Initial value**: `block` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **115** \| No \| **26** \| **115** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/view-timeline-axis |
| `viewTimelineInset` | `ViewTimelineInset<string \| number>` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ [ auto \| <length-percentage> ]{1,2} ]#` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **115** \| No \| **26** \| **115** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/view-timeline-inset |
| `viewTimelineName` | `ViewTimelineName` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ none \| <dashed-ident> ]#` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **115** \| No \| **26** \| **115** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/view-timeline-name |
| `viewTransitionClass` | `ViewTransitionClass` | No | - | **Syntax**: `none \| <custom-ident>+` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **125** \| **144** \| **18.2** \| **125** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/view-transition-class |
| `viewTransitionName` | `ViewTransitionName` | No | - | Since October 2025, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `none \| <custom-ident> \| match-element` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **111** \| **144** \| **18** \| **111** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/view-transition-name |
| `visibility` | `"visible" \| "hidden" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "collapse"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `visible \| hidden \| collapse` **Initial value**: `visible` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/visibility |
| `whiteSpace` | `WhiteSpace` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `normal \| pre \| pre-wrap \| pre-line \| <'white-space-collapse'> \|\| <'text-wrap-mode'>` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-----: \| \| **1** \| **1** \| **1** \| **12** \| **5.5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/white-space |
| `whiteSpaceCollapse` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "collapse" \| "break-spaces" \| "preserve" \| "preserve-breaks" \| "preserve-spaces"` | No | - | Since March 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `collapse \| preserve \| preserve-breaks \| preserve-spaces \| break-spaces` **Initial value**: `collapse` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **114** \| **124** \| **17.4** \| **114** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/white-space-collapse |
| `widows` | `Widows` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `<integer>` **Initial value**: `2` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :---: \| \| **25** \| No \| **1.3** \| **12** \| **8** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/widows |
| `willChange` | `WillChange` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `auto \| <animateable-feature>#` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :-: \| \| **36** \| **36** \| **9.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/will-change |
| `wordBreak` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "break-word" \| "auto-phrase" \| "break-all" \| "keep-all"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `normal \| break-all \| keep-all \| break-word \| auto-phrase` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-----: \| \| **1** \| **15** \| **3** \| **12** \| **5.5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/word-break |
| `wordSpacing` | `WordSpacing<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `normal \| <length>` **Initial value**: `normal` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **6** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/word-spacing |
| `wordWrap` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "break-word"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2018. **Syntax**: `normal \| break-word` **Initial value**: `normal` |
| `writingMode` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "horizontal-tb" \| "sideways-lr" \| "sideways-rl" \| "vertical-lr" \| "vertical-rl"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `horizontal-tb \| vertical-rl \| vertical-lr \| sideways-rl \| sideways-lr` **Initial value**: `horizontal-tb` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-------: \| :----: \| :---: \| \| **48** \| **41** \| **10.1** \| **12** \| **9** \| \| 8 _-x-_ \| \| 5.1 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/writing-mode |
| `x` | `X<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `<length> \| <percentage>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **42** \| **69** \| **9** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/x |
| `y` | `Y<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `<length> \| <percentage>` **Initial value**: `0` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **42** \| **69** \| **9** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/y |
| `zoom` | `Zoom` | No | - | Since May 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `normal \| reset \| <number [0,∞]> \|\| <percentage [0,∞]>` **Initial value**: `1` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :-----: \| \| **1** \| **126** \| **3.1** \| **12** \| **5.5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/zoom |
| `all` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `initial \| inherit \| unset \| revert \| revert-layer` **Initial value**: There is no practical initial value for it. \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :-: \| \| **37** \| **27** \| **9.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/all |
| `animation` | `Animation<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation>#` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **43** \| **16** \| **9** \| **12** \| **10** \| \| 3 _-x-_ \| 5 _-x-_ \| 4 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/animation |
| `animationRange` | `AnimationRange<string \| number>` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ <'animation-range-start'> <'animation-range-end'>? ]#` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **115** \| No \| **26** \| **115** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/animation-range |
| `background` | `Background<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<bg-layer>#? , <final-bg-layer>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/background |
| `backgroundPosition` | `BackgroundPosition<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<bg-position>#` **Initial value**: `0% 0%` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/background-position |
| `borderBlock` | `BorderBlock<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'border-block-start'>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **66** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-block |
| `borderBlockColor` | `BorderBlockColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'border-top-color'>{1,2}` **Initial value**: `currentcolor` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **66** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-block-color |
| `borderBlockEnd` | `BorderBlockEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-width'> \|\| <'border-top-style'> \|\| <color>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-block-end |
| `borderBlockStart` | `BorderBlockStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-width'> \|\| <'border-top-style'> \|\| <color>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-block-start |
| `borderBlockStyle` | `BorderBlockStyle` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'border-top-style'>{1,2}` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **66** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-block-style |
| `borderBlockWidth` | `BorderBlockWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'border-top-width'>{1,2}` **Initial value**: `medium` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **66** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-block-width |
| `borderBottom` | `BorderBottom<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-width> \|\| <line-style> \|\| <color>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-bottom |
| `borderColor` | `string` | No | - | Sets a border color by a key from the color palette or natively supported value (Hex, RGB, etc.) This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<color>{1,4}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-color |
| `borderImage` | `BorderImage` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<'border-image-source'> \|\| <'border-image-slice'> [ / <'border-image-width'> \| / <'border-image-width'>? / <'border-image-outset'> ]? \|\| <'border-image-repeat'>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-------: \| :-----: \| :----: \| :----: \| \| **16** \| **15** \| **6** \| **12** \| **11** \| \| 7 _-x-_ \| 3.5 _-x-_ \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-image |
| `borderInline` | `BorderInline<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'border-block-start'>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **66** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-inline |
| `borderInlineColor` | `BorderInlineColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'border-top-color'>{1,2}` **Initial value**: `currentcolor` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **66** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-inline-color |
| `borderInlineEnd` | `BorderInlineEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-width'> \|\| <'border-top-style'> \|\| <color>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-inline-end |
| `borderInlineStart` | `BorderInlineStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-width'> \|\| <'border-top-style'> \|\| <color>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **41** \| **12.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-inline-start |
| `borderInlineStyle` | `BorderInlineStyle` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'border-top-style'>{1,2}` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **66** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-inline-style |
| `borderInlineWidth` | `BorderInlineWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'border-top-width'>{1,2}` **Initial value**: `medium` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **66** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-inline-width |
| `borderLeft` | `BorderLeft<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-width> \|\| <line-style> \|\| <color>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-left |
| `borderRadius` | `BorderRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,4} [ / <length-percentage [0,∞]>{1,4} ]?` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :---: \| \| **4** \| **4** \| **5** \| **12** \| **9** \| \| 1 _-x-_ \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-radius |
| `borderRight` | `BorderRight<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-width> \|\| <line-style> \|\| <color>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-----: \| \| **1** \| **1** \| **1** \| **12** \| **5.5** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-right |
| `borderStyle` | `BorderStyle` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-style>{1,4}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-style |
| `borderTop` | `BorderTop<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-width> \|\| <line-style> \|\| <color>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-top |
| `borderWidth` | `BorderWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-width>{1,4}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/border-width |
| `caret` | `Caret` | No | - | **Syntax**: `<'caret-color'> \|\| <'caret-shape'>` |
| `columnRule` | `ColumnRule<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<'column-rule-width'> \|\| <'column-rule-style'> \|\| <'column-rule-color'>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-----: \| :----: \| :----: \| \| **50** \| **52** \| **9** \| **12** \| **10** \| \| 1 _-x-_ \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/column-rule |
| `columns` | `Columns<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<'column-width'> \|\| <'column-count'>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----: \| :----: \| :----: \| \| **50** \| **52** \| **9** \| **12** \| **10** \| \| \| \| 3 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/columns |
| `containIntrinsicSize` | `ContainIntrinsicSize<string \| number>` | No | - | Since September 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `[ auto? [ none \| <length> ] ]{1,2}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **83** \| **107** \| **17** \| **83** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/contain-intrinsic-size |
| `flex` | `Flex<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| [ <'flex-grow'> <'flex-shrink'>? \|\| <'flex-basis'> ]` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :-----: \| :----: \| :------: \| \| **29** \| **22** \| **9** \| **12** \| **11** \| \| 21 _-x-_ \| \| 7 _-x-_ \| \| 10 _-x-_ \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/flex |
| `flexFlow` | `FlexFlow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<'flex-direction'> \|\| <'flex-wrap'>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :-----: \| :----: \| :----: \| \| **29** \| **28** \| **9** \| **12** \| **11** \| \| 21 _-x-_ \| \| 7 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/flex-flow |
| `font` | `Font` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `[ [ <'font-style'> \|\| <font-variant-css2> \|\| <'font-weight'> \|\| <font-width-css3> ]? <'font-size'> [ / <'line-height'> ]? <'font-family'># ] \| <system-family-name>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **3** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/font |
| `gap` | `any` | No | - | Sets the gaps/gutters between flex items. Accepts a numeric value (multiplied by spacing unit), predefined spacing value (tiny, small, etc.) a spacing token (SP1, SP2, etc.) This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `<'row-gap'> <'column-gap'>?` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **52** \| **10.1** \| **16** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/gap |
| `gridArea` | `GridArea` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `<grid-line> [ / <grid-line> ]{0,3}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **52** \| **10.1** \| **16** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid-area |
| `gridColumn` | `GridColumn` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `<grid-line> [ / <grid-line> ]?` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **52** \| **10.1** \| **16** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid-column |
| `gridRow` | `GridRow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `<grid-line> [ / <grid-line> ]?` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **52** \| **10.1** \| **16** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid-row |
| `gridTemplate` | `GridTemplate` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `none \| [ <'grid-template-rows'> / <'grid-template-columns'> ] \| [ <line-names>? <string> <track-size>? <line-names>? ]+ [ / <explicit-track-list> ]?` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **57** \| **52** \| **10.1** \| **16** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/grid-template |
| `inset` | `Inset<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'top'>{1,4}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **66** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/inset |
| `insetBlock` | `InsetBlock<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'top'>{1,2}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **63** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/inset-block |
| `insetInline` | `InsetInline<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'top'>{1,2}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **63** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/inset-inline |
| `lineClamp` | `LineClamp` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| <integer>` **Initial value**: `none` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :---------: \| :----------: \| :-------: \| :----------: \| :-: \| \| **6** _-x-_ \| **68** _-x-_ \| 18.2-18.4 \| **17** _-x-_ \| No \| \| \| \| 5 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/line-clamp |
| `listStyle` | `ListStyle` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<'list-style-type'> \|\| <'list-style-position'> \|\| <'list-style-image'>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/list-style |
| `margin` | `any` | No | - | Sets margin on all sides. Accepts a numeric value (multiplied by spacing unit), predefined spacing value (tiny, small, etc.) a spacing token (SP1, SP2, etc.) or a string of space-separated values ("3px 3px") This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<'margin-top'>{1,4}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **3** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/margin |
| `marginBlock` | `MarginBlock<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'margin-top'>{1,2}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **66** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/margin-block |
| `marginInline` | `MarginInline<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'margin-top'>{1,2}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **66** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/margin-inline |
| `mask` | `Mask<string \| number>` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<mask-layer>#` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-------: \| :---: \| :-: \| \| **120** \| **53** \| **15.4** \| 12-79 \| No \| \| 1 _-x-_ \| \| 3.1 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask |
| `maskBorder` | `MaskBorder` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `<'mask-border-source'> \|\| <'mask-border-slice'> [ / <'mask-border-width'>? [ / <'mask-border-outset'> ]? ]? \|\| <'mask-border-repeat'> \|\| <'mask-border-mode'>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------------------------------: \| :-----: \| :----------------------------: \| :-------------------------------: \| :-: \| \| **1** _(-webkit-mask-box-image)_ \| No \| **17.2** \| **79** _(-webkit-mask-box-image)_ \| No \| \| \| \| 3.1 _(-webkit-mask-box-image)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/mask-border |
| `motion` | `Offset<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022. **Syntax**: `[ <'offset-position'>? [ <'offset-path'> [ <'offset-distance'> \|\| <'offset-rotate'> ]? ]? ]! [ / <'offset-anchor'> ]?` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----------: \| :-----: \| :----: \| :----: \| :-: \| \| **55** \| **72** \| **16** \| **79** \| No \| \| 46 _(motion)_ \| \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/offset |
| `offset` | `Offset<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022. **Syntax**: `[ <'offset-position'>? [ <'offset-path'> [ <'offset-distance'> \|\| <'offset-rotate'> ]? ]? ]! [ / <'offset-anchor'> ]?` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----------: \| :-----: \| :----: \| :----: \| :-: \| \| **55** \| **72** \| **16** \| **79** \| No \| \| 46 _(motion)_ \| \| \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/offset |
| `outline` | `Outline<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2023. **Syntax**: `<'outline-width'> \|\| <'outline-style'> \|\| <'outline-color'>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :---: \| \| **94** \| **88** \| **16.4** \| **94** \| **8** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/outline |
| `overscrollBehavior` | `OverscrollBehavior` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022. **Syntax**: `[ contain \| none \| auto ]{1,2}` **Initial value**: `auto` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **63** \| **59** \| **16** \| **18** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/overscroll-behavior |
| `padding` | `any` | No | - | Sets padding on all sides. Accepts a numeric value (multiplied by spacing unit), predefined spacing value (tiny, small, etc.) a spacing token (SP1, SP2, etc.) or a string of space-separated values ("3px 3px") This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<'padding-top'>{1,4}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **4** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/padding |
| `paddingBlock` | `PaddingBlock<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'padding-top'>{1,2}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **66** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/padding-block |
| `paddingInline` | `PaddingInline<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'padding-top'>{1,2}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **87** \| **66** \| **14.1** \| **87** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/padding-inline |
| `placeContent` | `PlaceContent` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'align-content'> <'justify-content'>?` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **59** \| **45** \| **9** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/place-content |
| `placeItems` | `PlaceItems` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'align-items'> <'justify-items'>?` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **59** \| **45** \| **11** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/place-items |
| `placeSelf` | `PlaceSelf` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'align-self'> <'justify-self'>?` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **59** \| **45** \| **11** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/place-self |
| `positionTry` | `PositionTry` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `<'position-try-order'>? <'position-try-fallbacks'>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :---------: \| :----: \| :-----: \| :-: \| \| **125** \| **preview** \| **26** \| **125** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/position-try |
| `scrollMargin` | `ScrollMargin<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2021. **Syntax**: `<length>{1,4}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----------------------: \| :----: \| :-: \| \| **69** \| **90** \| **14.1** \| **79** \| No \| \| \| \| 11 _(scroll-snap-margin)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin |
| `scrollMarginBlock` | `ScrollMarginBlock<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `<length>{1,2}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **69** \| **68** \| **15** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin-block |
| `scrollMarginInline` | `ScrollMarginInline<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `<length>{1,2}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **69** \| **68** \| **15** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin-inline |
| `scrollPadding` | `ScrollPadding<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `[ auto \| <length-percentage> ]{1,4}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :------: \| :----: \| :-: \| \| **69** \| **68** \| **14.1** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-padding |
| `scrollPaddingBlock` | `ScrollPaddingBlock<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `[ auto \| <length-percentage> ]{1,2}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **69** \| **68** \| **15** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-padding-block |
| `scrollPaddingInline` | `ScrollPaddingInline<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021. **Syntax**: `[ auto \| <length-percentage> ]{1,2}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :-: \| \| **69** \| **68** \| **15** \| **79** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-padding-inline |
| `scrollSnapMargin` | `ScrollMargin<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2021. **Syntax**: `<length>{1,4}` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :-----------------------: \| :----: \| :-: \| \| **69** \| 68-90 \| **14.1** \| **79** \| No \| \| \| \| 11 _(scroll-snap-margin)_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-margin |
| `scrollTimeline` | `ScrollTimeline` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ <'scroll-timeline-name'> <'scroll-timeline-axis'>? ]#` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **115** \| No \| **26** \| **115** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/scroll-timeline |
| `textDecoration` | `TextDecoration<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<'text-decoration-line'> \|\| <'text-decoration-style'> \|\| <'text-decoration-color'> \|\| <'text-decoration-thickness'>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :----: \| :-----: \| :----: \| :----: \| :---: \| \| **1** \| **1** \| **1** \| **12** \| **3** \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-decoration |
| `textEmphasis` | `TextEmphasis` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `<'text-emphasis-style'> \|\| <'text-emphasis-color'>` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :------: \| :-----: \| :----: \| :------: \| :-: \| \| **99** \| **46** \| **7** \| **99** \| No \| \| 25 _-x-_ \| \| \| 79 _-x-_ \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-emphasis |
| `textWrap` | `TextWrap` | No | - | Since March 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<'text-wrap-mode'> \|\| <'text-wrap-style'>` **Initial value**: `wrap` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :------: \| :-----: \| :-: \| \| **114** \| **121** \| **17.4** \| **114** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/text-wrap |
| `transition` | `Transition<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-transition>#` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :-------: \| :----: \| :----: \| \| **26** \| **16** \| **9** \| **12** \| **10** \| \| 1 _-x-_ \| \| 3.1 _-x-_ \| \| \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/transition |
| `viewTimeline` | `ViewTimeline` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ <'view-timeline-name'> [ <'view-timeline-axis'> \|\| <'view-timeline-inset'> ]? ]#` \| Chrome \| Firefox \| Safari \| Edge \| IE \| \| :-----: \| :-----: \| :----: \| :-----: \| :-: \| \| **115** \| No \| **26** \| **115** \| No \| @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/view-timeline |
| `MozAnimationDelay` | `AnimationDelay<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<time>#` **Initial value**: `0s` |
| `MozAnimationDirection` | `AnimationDirection` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-direction>#` **Initial value**: `normal` |
| `MozAnimationDuration` | `AnimationDuration<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `[ auto \| <time [0s,∞]> ]#` **Initial value**: `0s` |
| `MozAnimationFillMode` | `AnimationFillMode` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-fill-mode>#` **Initial value**: `none` |
| `MozAnimationIterationCount` | `AnimationIterationCount` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-iteration-count>#` **Initial value**: `1` |
| `MozAnimationName` | `AnimationName` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `[ none \| <keyframes-name> ]#` **Initial value**: `none` |
| `MozAnimationPlayState` | `AnimationPlayState` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-play-state>#` **Initial value**: `running` |
| `MozAnimationTimingFunction` | `AnimationTimingFunction` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<easing-function>#` **Initial value**: `ease` |
| `MozAppearance` | `"none" \| "button" \| "range" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "caret" \| "checkbox" \| "listbox" \| "listitem" \| "menubar" \| "menuitem" \| "progressbar" \| "radio" \| "separator" \| "tab" \| "tabpanel" \| "toolbar" \| "tooltip" \| "treeitem" \| "menulist" \| "searchfield" \| "menulist-button" \| "textfield" \| "-moz-mac-unified-toolbar" \| "-moz-win-borderless-glass" \| "-moz-win-browsertabbar-toolbox" \| "-moz-win-communications-toolbox" \| "-moz-win-communicationstext" \| "-moz-win-exclude-glass" \| "-moz-win-glass" \| "-moz-win-media-toolbox" \| "-moz-win-mediatext" \| "-moz-window-button-box" \| "-moz-window-button-box-maximized" \| "-moz-window-button-close" \| "-moz-window-button-maximize" \| "-moz-window-button-minimize" \| "-moz-window-button-restore" \| "-moz-window-frame-bottom" \| "-moz-window-frame-left" \| "-moz-window-frame-right" \| "-moz-window-titlebar" \| "-moz-window-titlebar-maximized" \| "button-arrow-down" \| "button-arrow-next" \| "button-arrow-previous" \| "button-arrow-up" \| "button-bevel" \| "button-focus" \| "checkbox-container" \| "checkbox-label" \| "checkmenuitem" \| "dualbutton" \| "groupbox" \| "menuarrow" \| "menucheckbox" \| "menuimage" \| "menuitemtext" \| "menulist-text" \| "menulist-textfield" \| "menupopup" \| "menuradio" \| "menuseparator" \| "meterbar" \| "meterchunk" \| "progressbar-vertical" \| "progresschunk" \| "progresschunk-vertical" \| "radio-container" \| "radio-label" \| "radiomenuitem" \| "range-thumb" \| "resizer" \| "resizerpanel" \| "scale-horizontal" \| "scale-vertical" \| "scalethumb-horizontal" \| "scalethumb-vertical" \| "scalethumbend" \| "scalethumbstart" \| "scalethumbtick" \| "scrollbarbutton-down" \| "scrollbarbutton-left" \| "scrollbarbutton-right" \| "scrollbarbutton-up" \| "scrollbarthumb-horizontal" \| "scrollbarthumb-vertical" \| "scrollbartrack-horizontal" \| "scrollbartrack-vertical" \| "sheet" \| "spinner" \| "spinner-downbutton" \| "spinner-textfield" \| "spinner-upbutton" \| "splitter" \| "statusbar" \| "statusbarpanel" \| "tab-scroll-arrow-back" \| "tab-scroll-arrow-forward" \| "tabpanels" \| "textfield-multiline" \| "toolbarbutton" \| "toolbarbutton-dropdown" \| "toolbargripper" \| "toolbox" \| "treeheader" \| "treeheadercell" \| "treeheadersortarrow" \| "treeline" \| "treetwisty" \| "treetwistyopen" \| "treeview"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `none \| button \| button-arrow-down \| button-arrow-next \| button-arrow-previous \| button-arrow-up \| button-bevel \| button-focus \| caret \| checkbox \| checkbox-container \| checkbox-label \| checkmenuitem \| dualbutton \| groupbox \| listbox \| listitem \| menuarrow \| menubar \| menucheckbox \| menuimage \| menuitem \| menuitemtext \| menulist \| menulist-button \| menulist-text \| menulist-textfield \| menupopup \| menuradio \| menuseparator \| meterbar \| meterchunk \| progressbar \| progressbar-vertical \| progresschunk \| progresschunk-vertical \| radio \| radio-container \| radio-label \| radiomenuitem \| range \| range-thumb \| resizer \| resizerpanel \| scale-horizontal \| scalethumbend \| scalethumb-horizontal \| scalethumbstart \| scalethumbtick \| scalethumb-vertical \| scale-vertical \| scrollbarbutton-down \| scrollbarbutton-left \| scrollbarbutton-right \| scrollbarbutton-up \| scrollbarthumb-horizontal \| scrollbarthumb-vertical \| scrollbartrack-horizontal \| scrollbartrack-vertical \| searchfield \| separator \| sheet \| spinner \| spinner-downbutton \| spinner-textfield \| spinner-upbutton \| splitter \| statusbar \| statusbarpanel \| tab \| tabpanel \| tabpanels \| tab-scroll-arrow-back \| tab-scroll-arrow-forward \| textfield \| textfield-multiline \| toolbar \| toolbarbutton \| toolbarbutton-dropdown \| toolbargripper \| toolbox \| tooltip \| treeheader \| treeheadercell \| treeheadersortarrow \| treeitem \| treeline \| treetwisty \| treetwistyopen \| treeview \| -moz-mac-unified-toolbar \| -moz-win-borderless-glass \| -moz-win-browsertabbar-toolbox \| -moz-win-communicationstext \| -moz-win-communications-toolbox \| -moz-win-exclude-glass \| -moz-win-glass \| -moz-win-mediatext \| -moz-win-media-toolbox \| -moz-window-button-box \| -moz-window-button-box-maximized \| -moz-window-button-close \| -moz-window-button-maximize \| -moz-window-button-minimize \| -moz-window-button-restore \| -moz-window-frame-bottom \| -moz-window-frame-left \| -moz-window-frame-right \| -moz-window-titlebar \| -moz-window-titlebar-maximized` **Initial value**: `none` (but this value is overridden in the user agent CSS) |
| `MozBackfaceVisibility` | `"visible" \| "hidden" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `visible \| hidden` **Initial value**: `visible` |
| `MozBinding` | `MozBinding` | No | - | **Syntax**: `<url> \| none` **Initial value**: `none` |
| `MozBorderBottomColors` | `MozBorderBottomColors` | No | - | **Syntax**: `<color>+ \| none` **Initial value**: `none` |
| `MozBorderEndColor` | `BorderInlineEndColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-color'>` **Initial value**: `currentcolor` |
| `MozBorderEndStyle` | `"hidden" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inset" \| "dashed" \| "dotted" \| "double" \| "groove" \| "outset" \| "ridge" \| "solid"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-style'>` **Initial value**: `none` |
| `MozBorderEndWidth` | `BorderInlineEndWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-width'>` **Initial value**: `medium` |
| `MozBorderLeftColors` | `MozBorderLeftColors` | No | - | **Syntax**: `<color>+ \| none` **Initial value**: `none` |
| `MozBorderRightColors` | `MozBorderRightColors` | No | - | **Syntax**: `<color>+ \| none` **Initial value**: `none` |
| `MozBorderStartColor` | `BorderInlineStartColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-color'>` **Initial value**: `currentcolor` |
| `MozBorderStartStyle` | `"hidden" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inset" \| "dashed" \| "dotted" \| "double" \| "groove" \| "outset" \| "ridge" \| "solid"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'border-top-style'>` **Initial value**: `none` |
| `MozBorderTopColors` | `MozBorderTopColors` | No | - | **Syntax**: `<color>+ \| none` **Initial value**: `none` |
| `MozBoxSizing` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "border-box" \| "content-box"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `content-box \| border-box` **Initial value**: `content-box` |
| `MozColumnRuleColor` | `ColumnRuleColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<color>` **Initial value**: `currentcolor` |
| `MozColumnRuleStyle` | `ColumnRuleStyle` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<'border-style'>` **Initial value**: `none` |
| `MozColumnRuleWidth` | `ColumnRuleWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<'border-width'>` **Initial value**: `medium` |
| `MozColumnWidth` | `ColumnWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since November 2016. **Syntax**: `<length> \| auto` **Initial value**: `auto` |
| `MozContextProperties` | `MozContextProperties` | No | - | **Syntax**: `none \| [ fill \| fill-opacity \| stroke \| stroke-opacity ]#` **Initial value**: `none` |
| `MozFontFeatureSettings` | `FontFeatureSettings` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `normal \| <feature-tag-value>#` **Initial value**: `normal` |
| `MozFontLanguageOverride` | `FontLanguageOverride` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `normal \| <string>` **Initial value**: `normal` |
| `MozHyphens` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "manual"` | No | - | Since September 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `none \| manual \| auto` **Initial value**: `manual` |
| `MozMarginEnd` | `MarginInlineEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'margin-top'>` **Initial value**: `0` |
| `MozMarginStart` | `MarginInlineStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'margin-top'>` **Initial value**: `0` |
| `MozOrient` | `"inline" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "horizontal" \| "vertical" \| "block"` | No | - | The **`-moz-orient`** CSS property specifies the orientation of the element to which it's applied. **Syntax**: `inline \| block \| horizontal \| vertical` **Initial value**: `inline` |
| `MozOsxFontSmoothing` | `FontSmooth<string \| number>` | No | - | The **`font-smooth`** CSS property controls the application of anti-aliasing when fonts are rendered. **Syntax**: `auto \| never \| always \| <absolute-size> \| <length>` **Initial value**: `auto` |
| `MozOutlineRadiusBottomleft` | `MozOutlineRadiusBottomleft<string \| number>` | No | - | **Syntax**: `<outline-radius>` **Initial value**: `0` |
| `MozOutlineRadiusBottomright` | `MozOutlineRadiusBottomright<string \| number>` | No | - | **Syntax**: `<outline-radius>` **Initial value**: `0` |
| `MozOutlineRadiusTopleft` | `MozOutlineRadiusTopleft<string \| number>` | No | - | **Syntax**: `<outline-radius>` **Initial value**: `0` |
| `MozOutlineRadiusTopright` | `MozOutlineRadiusTopright<string \| number>` | No | - | **Syntax**: `<outline-radius>` **Initial value**: `0` |
| `MozPaddingEnd` | `PaddingInlineEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'padding-top'>` **Initial value**: `0` |
| `MozPaddingStart` | `PaddingInlineStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'padding-top'>` **Initial value**: `0` |
| `MozPerspective` | `Perspective<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| <length>` **Initial value**: `none` |
| `MozPerspectiveOrigin` | `PerspectiveOrigin<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<position>` **Initial value**: `50% 50%` |
| `MozStackSizing` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "ignore" \| "stretch-to-fit"` | No | - | **Syntax**: `ignore \| stretch-to-fit` **Initial value**: `stretch-to-fit` |
| `MozTabSize` | `TabSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since August 2021. **Syntax**: `<integer> \| <length>` **Initial value**: `8` |
| `MozTextBlink` | `"blink" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | **Syntax**: `none \| blink` **Initial value**: `none` |
| `MozTextSizeAdjust` | `TextSizeAdjust` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| auto \| <percentage>` **Initial value**: `auto` for smartphone browsers supporting inflation, `none` in other cases (and then not modifiable). |
| `MozTransform` | `Transform` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| <transform-list>` **Initial value**: `none` |
| `MozTransformOrigin` | `TransformOrigin<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `[ <length-percentage> \| left \| center \| right \| top \| bottom ] \| [ [ <length-percentage> \| left \| center \| right ] && [ <length-percentage> \| top \| center \| bottom ] ] <length>?` **Initial value**: `50% 50% 0` |
| `MozTransformStyle` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "flat" \| "preserve-3d"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `flat \| preserve-3d` **Initial value**: `flat` |
| `MozUserModify` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "read-only" \| "read-write" \| "write-only"` | No | - | The **`user-modify`** property has no effect in Firefox. It was originally planned to determine whether or not the content of an element can be edited by a user. **Syntax**: `read-only \| read-write \| write-only` **Initial value**: `read-only` |
| `MozUserSelect` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "text" \| "all" \| "-moz-none"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `auto \| text \| none \| all` **Initial value**: `auto` |
| `MozWindowDragging` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "drag" \| "no-drag"` | No | - | **Syntax**: `drag \| no-drag` **Initial value**: `drag` |
| `MozWindowShadow` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "default" \| "menu" \| "tooltip" \| "sheet"` | No | - | **Syntax**: `default \| menu \| tooltip \| sheet \| none` **Initial value**: `default` |
| `msAccelerator` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "false" \| "true"` | No | - | **Syntax**: `false \| true` **Initial value**: `false` |
| `msBlockProgression` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "bt" \| "lr" \| "rl" \| "tb"` | No | - | **Syntax**: `tb \| rl \| bt \| lr` **Initial value**: `tb` |
| `msContentZoomChaining` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "chained"` | No | - | **Syntax**: `none \| chained` **Initial value**: `none` |
| `msContentZoomLimitMax` | `MsContentZoomLimitMax` | No | - | **Syntax**: `<percentage>` **Initial value**: `400%` |
| `msContentZoomLimitMin` | `MsContentZoomLimitMin` | No | - | **Syntax**: `<percentage>` **Initial value**: `100%` |
| `msContentZoomSnapPoints` | `MsContentZoomSnapPoints` | No | - | **Syntax**: `snapInterval( <percentage>, <percentage> ) \| snapList( <percentage># )` **Initial value**: `snapInterval(0%, 100%)` |
| `msContentZoomSnapType` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "mandatory" \| "proximity"` | No | - | **Syntax**: `none \| proximity \| mandatory` **Initial value**: `none` |
| `msContentZooming` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "zoom"` | No | - | **Syntax**: `none \| zoom` **Initial value**: zoom for the top level element, none for all other elements |
| `msFilter` | `MsFilter` | No | - | **Syntax**: `<string>` **Initial value**: "" (the empty string) |
| `msFlexDirection` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "row" \| "column" \| "column-reverse" \| "row-reverse"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `row \| row-reverse \| column \| column-reverse` **Initial value**: `row` |
| `msFlexPositive` | `FlexGrow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<number>` **Initial value**: `0` |
| `msFlowFrom` | `MsFlowFrom` | No | - | **Syntax**: `[ none \| <custom-ident> ]#` **Initial value**: `none` |
| `msFlowInto` | `MsFlowInto` | No | - | **Syntax**: `[ none \| <custom-ident> ]#` **Initial value**: `none` |
| `msGridColumns` | `MsGridColumns<string \| number>` | No | - | **Syntax**: `none \| <track-list> \| <auto-track-list>` **Initial value**: `none` |
| `msGridRows` | `MsGridRows<string \| number>` | No | - | **Syntax**: `none \| <track-list> \| <auto-track-list>` **Initial value**: `none` |
| `msHighContrastAdjust` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | **Syntax**: `auto \| none` **Initial value**: `auto` |
| `msHyphenateLimitChars` | `MsHyphenateLimitChars` | No | - | **Syntax**: `auto \| <integer>{1,3}` **Initial value**: `auto` |
| `msHyphenateLimitLines` | `MsHyphenateLimitLines` | No | - | **Syntax**: `no-limit \| <integer>` **Initial value**: `no-limit` |
| `msHyphenateLimitZone` | `MsHyphenateLimitZone<string \| number>` | No | - | **Syntax**: `<percentage> \| <length>` **Initial value**: `0` |
| `msHyphens` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "manual"` | No | - | Since September 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `none \| manual \| auto` **Initial value**: `manual` |
| `msImeAlign` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "after"` | No | - | **Syntax**: `auto \| after` **Initial value**: `auto` |
| `msLineBreak` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "strict" \| "anywhere" \| "loose"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `auto \| loose \| normal \| strict \| anywhere` **Initial value**: `auto` |
| `msOrder` | `Order` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<integer>` **Initial value**: `0` |
| `msOverflowStyle` | `"scrollbar" \| "auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "-ms-autohiding-scrollbar"` | No | - | **Syntax**: `auto \| none \| scrollbar \| -ms-autohiding-scrollbar` **Initial value**: `auto` |
| `msOverflowX` | `"visible" \| "hidden" \| "scroll" \| "auto" \| "overlay" \| "clip" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "-moz-hidden-unscrollable"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `visible \| hidden \| clip \| scroll \| auto` **Initial value**: `visible` |
| `msOverflowY` | `"visible" \| "hidden" \| "scroll" \| "auto" \| "overlay" \| "clip" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "-moz-hidden-unscrollable"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `visible \| hidden \| clip \| scroll \| auto` **Initial value**: `visible` |
| `msScrollChaining` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "chained"` | No | - | **Syntax**: `chained \| none` **Initial value**: `chained` |
| `msScrollLimitXMax` | `MsScrollLimitXMax<string \| number>` | No | - | **Syntax**: `auto \| <length>` **Initial value**: `auto` |
| `msScrollLimitXMin` | `MsScrollLimitXMin<string \| number>` | No | - | **Syntax**: `<length>` **Initial value**: `0` |
| `msScrollLimitYMax` | `MsScrollLimitYMax<string \| number>` | No | - | **Syntax**: `auto \| <length>` **Initial value**: `auto` |
| `msScrollLimitYMin` | `MsScrollLimitYMin<string \| number>` | No | - | **Syntax**: `<length>` **Initial value**: `0` |
| `msScrollRails` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "railed"` | No | - | **Syntax**: `none \| railed` **Initial value**: `railed` |
| `msScrollSnapPointsX` | `MsScrollSnapPointsX` | No | - | **Syntax**: `snapInterval( <length-percentage>, <length-percentage> ) \| snapList( <length-percentage># )` **Initial value**: `snapInterval(0px, 100%)` |
| `msScrollSnapPointsY` | `MsScrollSnapPointsY` | No | - | **Syntax**: `snapInterval( <length-percentage>, <length-percentage> ) \| snapList( <length-percentage># )` **Initial value**: `snapInterval(0px, 100%)` |
| `msScrollSnapType` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "mandatory" \| "proximity"` | No | - | **Syntax**: `none \| proximity \| mandatory` **Initial value**: `none` |
| `msScrollTranslation` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "vertical-to-horizontal"` | No | - | **Syntax**: `none \| vertical-to-horizontal` **Initial value**: `none` |
| `msScrollbar3dlightColor` | `MsScrollbar3dlightColor` | No | - | **Syntax**: `<color>` **Initial value**: depends on user agent |
| `msScrollbarArrowColor` | `MsScrollbarArrowColor` | No | - | **Syntax**: `<color>` **Initial value**: `ButtonText` |
| `msScrollbarBaseColor` | `MsScrollbarBaseColor` | No | - | **Syntax**: `<color>` **Initial value**: depends on user agent |
| `msScrollbarDarkshadowColor` | `MsScrollbarDarkshadowColor` | No | - | **Syntax**: `<color>` **Initial value**: `ThreeDDarkShadow` |
| `msScrollbarFaceColor` | `MsScrollbarFaceColor` | No | - | **Syntax**: `<color>` **Initial value**: `ThreeDFace` |
| `msScrollbarHighlightColor` | `MsScrollbarHighlightColor` | No | - | **Syntax**: `<color>` **Initial value**: `ThreeDHighlight` |
| `msScrollbarShadowColor` | `MsScrollbarShadowColor` | No | - | **Syntax**: `<color>` **Initial value**: `ThreeDDarkShadow` |
| `msScrollbarTrackColor` | `MsScrollbarTrackColor` | No | - | **Syntax**: `<color>` **Initial value**: `Scrollbar` |
| `msTextAutospace` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "ideograph-alpha" \| "ideograph-numeric" \| "ideograph-parenthesis" \| "ideograph-space"` | No | - | **Syntax**: `none \| ideograph-alpha \| ideograph-numeric \| ideograph-parenthesis \| ideograph-space` **Initial value**: `none` |
| `msTextCombineHorizontal` | `TextCombineUpright` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `none \| all \| [ digits <integer>? ]` **Initial value**: `none` |
| `msTextOverflow` | `TextOverflow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `[ clip \| ellipsis \| <string> ]{1,2}` **Initial value**: `clip` |
| `msTouchAction` | `TouchAction` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2019. **Syntax**: `auto \| none \| [ [ pan-x \| pan-left \| pan-right ] \|\| [ pan-y \| pan-up \| pan-down ] \|\| pinch-zoom ] \| manipulation` **Initial value**: `auto` |
| `msTouchSelect` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "grippers"` | No | - | **Syntax**: `grippers \| none` **Initial value**: `grippers` |
| `msTransform` | `Transform` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| <transform-list>` **Initial value**: `none` |
| `msTransformOrigin` | `TransformOrigin<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `[ <length-percentage> \| left \| center \| right \| top \| bottom ] \| [ [ <length-percentage> \| left \| center \| right ] && [ <length-percentage> \| top \| center \| bottom ] ] <length>?` **Initial value**: `50% 50% 0` |
| `msTransitionDelay` | `TransitionDelay<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<time>#` **Initial value**: `0s` |
| `msTransitionDuration` | `TransitionDuration<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<time>#` **Initial value**: `0s` |
| `msTransitionProperty` | `TransitionProperty` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| <single-transition-property>#` **Initial value**: all |
| `msTransitionTimingFunction` | `TransitionTimingFunction` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<easing-function>#` **Initial value**: `ease` |
| `msUserSelect` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "text" \| "element"` | No | - | **Syntax**: `none \| element \| text` **Initial value**: `text` |
| `msWordBreak` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "break-word" \| "auto-phrase" \| "break-all" \| "keep-all"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `normal \| break-all \| keep-all \| break-word \| auto-phrase` **Initial value**: `normal` |
| `msWrapFlow` | `"auto" \| "start" \| "end" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "clear" \| "both" \| "maximum"` | No | - | **Syntax**: `auto \| both \| start \| end \| maximum \| clear` **Initial value**: `auto` |
| `msWrapMargin` | `MsWrapMargin<string \| number>` | No | - | **Syntax**: `<length>` **Initial value**: `0` |
| `msWrapThrough` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "wrap"` | No | - | **Syntax**: `wrap \| none` **Initial value**: `wrap` |
| `msWritingMode` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "horizontal-tb" \| "sideways-lr" \| "sideways-rl" \| "vertical-lr" \| "vertical-rl"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `horizontal-tb \| vertical-rl \| vertical-lr \| sideways-rl \| sideways-lr` **Initial value**: `horizontal-tb` |
| `WebkitAlignContent` | `AlignContent` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `normal \| <baseline-position> \| <content-distribution> \| <overflow-position>? <content-position>` **Initial value**: `normal` |
| `WebkitAlignItems` | `AlignItems` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `normal \| stretch \| <baseline-position> \| [ <overflow-position>? <self-position> ] \| anchor-center` **Initial value**: `normal` |
| `WebkitAlignSelf` | `AlignSelf` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `auto \| normal \| stretch \| <baseline-position> \| <overflow-position>? <self-position> \| anchor-center` **Initial value**: `auto` |
| `WebkitAnimationDelay` | `AnimationDelay<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<time>#` **Initial value**: `0s` |
| `WebkitAnimationDirection` | `AnimationDirection` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-direction>#` **Initial value**: `normal` |
| `WebkitAnimationDuration` | `AnimationDuration<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `[ auto \| <time [0s,∞]> ]#` **Initial value**: `0s` |
| `WebkitAnimationFillMode` | `AnimationFillMode` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-fill-mode>#` **Initial value**: `none` |
| `WebkitAnimationIterationCount` | `AnimationIterationCount` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-iteration-count>#` **Initial value**: `1` |
| `WebkitAnimationName` | `AnimationName` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `[ none \| <keyframes-name> ]#` **Initial value**: `none` |
| `WebkitAnimationPlayState` | `AnimationPlayState` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-play-state>#` **Initial value**: `running` |
| `WebkitAnimationTimingFunction` | `AnimationTimingFunction` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<easing-function>#` **Initial value**: `ease` |
| `WebkitAppearance` | `"none" \| "button" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "caret" \| "checkbox" \| "listbox" \| "listitem" \| "radio" \| "menulist" \| "meter" \| "progress-bar" \| "searchfield" \| "textarea" \| "menulist-button" \| "textfield" \| "button-bevel" \| "menulist-text" \| "menulist-textfield" \| "-apple-pay-button" \| "default-button" \| "inner-spin-button" \| "media-controls-background" \| "media-controls-fullscreen-background" \| "media-current-time-display" \| "media-enter-fullscreen-button" \| "media-exit-fullscreen-button" \| "media-fullscreen-button" \| "media-mute-button" \| "media-overlay-play-button" \| "media-play-button" \| "media-seek-back-button" \| "media-seek-forward-button" \| "media-slider" \| "media-sliderthumb" \| "media-time-remaining-display" \| "media-toggle-closed-captions-button" \| "media-volume-slider" \| "media-volume-slider-container" \| "media-volume-sliderthumb" \| "progress-bar-value" \| "push-button" \| "searchfield-cancel-button" \| "searchfield-decoration" \| "searchfield-results-button" \| "searchfield-results-decoration" \| "slider-horizontal" \| "slider-vertical" \| "sliderthumb-horizontal" \| "sliderthumb-vertical" \| "square-button"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `none \| button \| button-bevel \| caret \| checkbox \| default-button \| inner-spin-button \| listbox \| listitem \| media-controls-background \| media-controls-fullscreen-background \| media-current-time-display \| media-enter-fullscreen-button \| media-exit-fullscreen-button \| media-fullscreen-button \| media-mute-button \| media-overlay-play-button \| media-play-button \| media-seek-back-button \| media-seek-forward-button \| media-slider \| media-sliderthumb \| media-time-remaining-display \| media-toggle-closed-captions-button \| media-volume-slider \| media-volume-slider-container \| media-volume-sliderthumb \| menulist \| menulist-button \| menulist-text \| menulist-textfield \| meter \| progress-bar \| progress-bar-value \| push-button \| radio \| searchfield \| searchfield-cancel-button \| searchfield-decoration \| searchfield-results-button \| searchfield-results-decoration \| slider-horizontal \| slider-vertical \| sliderthumb-horizontal \| sliderthumb-vertical \| square-button \| textarea \| textfield \| -apple-pay-button` **Initial value**: `none` (but this value is overridden in the user agent CSS) |
| `WebkitBackdropFilter` | `BackdropFilter` | No | - | Since September 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `none \| <filter-value-list>` **Initial value**: `none` |
| `WebkitBackfaceVisibility` | `"visible" \| "hidden" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `visible \| hidden` **Initial value**: `visible` |
| `WebkitBackgroundClip` | `BackgroundClip` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<bg-clip>#` **Initial value**: `border-box` |
| `WebkitBackgroundOrigin` | `BackgroundOrigin` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<visual-box>#` **Initial value**: `padding-box` |
| `WebkitBackgroundSize` | `BackgroundSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<bg-size>#` **Initial value**: `auto auto` |
| `WebkitBorderBeforeColor` | `WebkitBorderBeforeColor` | No | - | **Syntax**: `<color>` **Initial value**: `currentcolor` |
| `WebkitBorderBeforeStyle` | `WebkitBorderBeforeStyle` | No | - | **Syntax**: `<'border-style'>` **Initial value**: `none` |
| `WebkitBorderBeforeWidth` | `WebkitBorderBeforeWidth<string \| number>` | No | - | **Syntax**: `<'border-width'>` **Initial value**: `medium` |
| `WebkitBorderBottomLeftRadius` | `BorderBottomLeftRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,2}` **Initial value**: `0` |
| `WebkitBorderBottomRightRadius` | `BorderBottomRightRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,2}` **Initial value**: `0` |
| `WebkitBorderImageSlice` | `BorderImageSlice` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `[ <number [0,∞]> \| <percentage [0,∞]> ]{1,4} && fill?` **Initial value**: `100%` |
| `WebkitBorderTopLeftRadius` | `BorderTopLeftRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,2}` **Initial value**: `0` |
| `WebkitBorderTopRightRadius` | `BorderTopRightRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,2}` **Initial value**: `0` |
| `WebkitBoxDecorationBreak` | `"slice" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "clone"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `slice \| clone` **Initial value**: `slice` |
| `WebkitBoxReflect` | `WebkitBoxReflect<string \| number>` | No | - | The **`-webkit-box-reflect`** CSS property lets you reflect the content of an element in one specific direction. **Syntax**: `[ above \| below \| right \| left ]? <length>? <image>?` **Initial value**: `none` |
| `WebkitBoxShadow` | `BoxShadow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `none \| <shadow>#` **Initial value**: `none` |
| `WebkitBoxSizing` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "border-box" \| "content-box"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `content-box \| border-box` **Initial value**: `content-box` |
| `WebkitClipPath` | `ClipPath` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<clip-source> \| [ <basic-shape> \|\| <geometry-box> ] \| none` **Initial value**: `none` |
| `WebkitColumnCount` | `ColumnCount` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<integer> \| auto` **Initial value**: `auto` |
| `WebkitColumnFill` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "balance"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `auto \| balance` **Initial value**: `balance` |
| `WebkitColumnRuleColor` | `ColumnRuleColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<color>` **Initial value**: `currentcolor` |
| `WebkitColumnRuleStyle` | `ColumnRuleStyle` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<'border-style'>` **Initial value**: `none` |
| `WebkitColumnRuleWidth` | `ColumnRuleWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<'border-width'>` **Initial value**: `medium` |
| `WebkitColumnSpan` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "all"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `none \| all` **Initial value**: `none` |
| `WebkitColumnWidth` | `ColumnWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since November 2016. **Syntax**: `<length> \| auto` **Initial value**: `auto` |
| `WebkitFilter` | `Filter` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2016. **Syntax**: `none \| <filter-value-list>` **Initial value**: `none` |
| `WebkitFlexBasis` | `FlexBasis<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `content \| <'width'>` **Initial value**: `auto` |
| `WebkitFlexDirection` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "row" \| "column" \| "column-reverse" \| "row-reverse"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `row \| row-reverse \| column \| column-reverse` **Initial value**: `row` |
| `WebkitFlexGrow` | `FlexGrow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<number>` **Initial value**: `0` |
| `WebkitFlexShrink` | `FlexShrink` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<number>` **Initial value**: `1` |
| `WebkitFlexWrap` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "nowrap" \| "wrap" \| "wrap-reverse"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `nowrap \| wrap \| wrap-reverse` **Initial value**: `nowrap` |
| `WebkitFontFeatureSettings` | `FontFeatureSettings` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `normal \| <feature-tag-value>#` **Initial value**: `normal` |
| `WebkitFontKerning` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `auto \| normal \| none` **Initial value**: `auto` |
| `WebkitFontSmoothing` | `FontSmooth<string \| number>` | No | - | The **`font-smooth`** CSS property controls the application of anti-aliasing when fonts are rendered. **Syntax**: `auto \| never \| always \| <absolute-size> \| <length>` **Initial value**: `auto` |
| `WebkitFontVariantLigatures` | `FontVariantLigatures` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `normal \| none \| [ <common-lig-values> \|\| <discretionary-lig-values> \|\| <historical-lig-values> \|\| <contextual-alt-values> ]` **Initial value**: `normal` |
| `WebkitHyphenateCharacter` | `HyphenateCharacter` | No | - | Since September 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `auto \| <string>` **Initial value**: `auto` |
| `WebkitHyphens` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "manual"` | No | - | Since September 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `none \| manual \| auto` **Initial value**: `manual` |
| `WebkitInitialLetter` | `InitialLetter` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `normal \| [ <number> <integer>? ]` **Initial value**: `normal` |
| `WebkitJustifyContent` | `JustifyContent` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `normal \| <content-distribution> \| <overflow-position>? [ <content-position> \| left \| right ]` **Initial value**: `normal` |
| `WebkitLineBreak` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "strict" \| "anywhere" \| "loose"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `auto \| loose \| normal \| strict \| anywhere` **Initial value**: `auto` |
| `WebkitLineClamp` | `WebkitLineClamp` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| <integer>` **Initial value**: `none` |
| `WebkitLogicalHeight` | `BlockSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'width'>` **Initial value**: `auto` |
| `WebkitLogicalWidth` | `InlineSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'width'>` **Initial value**: `auto` |
| `WebkitMarginEnd` | `MarginInlineEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'margin-top'>` **Initial value**: `0` |
| `WebkitMarginStart` | `MarginInlineStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'margin-top'>` **Initial value**: `0` |
| `WebkitMaskAttachment` | `WebkitMaskAttachment` | No | - | **Syntax**: `<attachment>#` **Initial value**: `scroll` |
| `WebkitMaskBoxImageOutset` | `MaskBorderOutset<string \| number>` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ <length> \| <number> ]{1,4}` **Initial value**: `0` |
| `WebkitMaskBoxImageRepeat` | `MaskBorderRepeat` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ stretch \| repeat \| round \| space ]{1,2}` **Initial value**: `stretch` |
| `WebkitMaskBoxImageSlice` | `MaskBorderSlice` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `<number-percentage>{1,4} fill?` **Initial value**: `0` |
| `WebkitMaskBoxImageSource` | `MaskBorderSource` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| <image>` **Initial value**: `none` |
| `WebkitMaskBoxImageWidth` | `MaskBorderWidth<string \| number>` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `[ <length-percentage> \| <number> \| auto ]{1,4}` **Initial value**: `auto` |
| `WebkitMaskClip` | `WebkitMaskClip` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `[ <coord-box> \| no-clip \| border \| padding \| content \| text ]#` **Initial value**: `border` |
| `WebkitMaskComposite` | `WebkitMaskComposite` | No | - | The **`-webkit-mask-composite`** property specifies the manner in which multiple mask images applied to the same element are composited with one another. Mask images are composited in the opposite order that they are declared with the `-webkit-mask-image` property. **Syntax**: `<composite-style>#` **Initial value**: `source-over` |
| `WebkitMaskImage` | `WebkitMaskImage` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<mask-reference>#` **Initial value**: `none` |
| `WebkitMaskOrigin` | `WebkitMaskOrigin` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `[ <coord-box> \| border \| padding \| content ]#` **Initial value**: `padding` |
| `WebkitMaskPosition` | `WebkitMaskPosition<string \| number>` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<position>#` **Initial value**: `0% 0%` |
| `WebkitMaskPositionX` | `WebkitMaskPositionX<string \| number>` | No | - | The `-webkit-mask-position-x` CSS property sets the initial horizontal position of a mask image. **Syntax**: `[ <length-percentage> \| left \| center \| right ]#` **Initial value**: `0%` |
| `WebkitMaskPositionY` | `WebkitMaskPositionY<string \| number>` | No | - | The `-webkit-mask-position-y` CSS property sets the initial vertical position of a mask image. **Syntax**: `[ <length-percentage> \| top \| center \| bottom ]#` **Initial value**: `0%` |
| `WebkitMaskRepeat` | `WebkitMaskRepeat` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<repeat-style>#` **Initial value**: `repeat` |
| `WebkitMaskRepeatX` | `"repeat" \| "round" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "no-repeat" \| "space"` | No | - | The `-webkit-mask-repeat-x` property specifies whether and how a mask image is repeated (tiled) horizontally. **Syntax**: `repeat \| no-repeat \| space \| round` **Initial value**: `repeat` |
| `WebkitMaskRepeatY` | `"repeat" \| "round" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "no-repeat" \| "space"` | No | - | The `-webkit-mask-repeat-y` property sets whether and how a mask image is repeated (tiled) vertically. **Syntax**: `repeat \| no-repeat \| space \| round` **Initial value**: `repeat` |
| `WebkitMaskSize` | `WebkitMaskSize<string \| number>` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `<bg-size>#` **Initial value**: `auto auto` |
| `WebkitMaxInlineSize` | `MaxInlineSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'max-width'>` **Initial value**: `none` |
| `WebkitOrder` | `Order` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<integer>` **Initial value**: `0` |
| `WebkitOverflowScrolling` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "touch"` | No | - | **Syntax**: `auto \| touch` **Initial value**: `auto` |
| `WebkitPaddingEnd` | `PaddingInlineEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'padding-top'>` **Initial value**: `0` |
| `WebkitPaddingStart` | `PaddingInlineStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<'padding-top'>` **Initial value**: `0` |
| `WebkitPerspective` | `Perspective<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| <length>` **Initial value**: `none` |
| `WebkitPerspectiveOrigin` | `PerspectiveOrigin<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<position>` **Initial value**: `50% 50%` |
| `WebkitPrintColorAdjust` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "economy" \| "exact"` | No | - | Since May 2025, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `economy \| exact` **Initial value**: `economy` |
| `WebkitRubyPosition` | `RubyPosition` | No | - | Since December 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `[ alternate \|\| [ over \| under ] ] \| inter-character` **Initial value**: `alternate` |
| `WebkitScrollSnapType` | `ScrollSnapType` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2022. **Syntax**: `none \| [ x \| y \| block \| inline \| both ] [ mandatory \| proximity ]?` **Initial value**: `none` |
| `WebkitShapeMargin` | `ShapeMargin<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<length-percentage>` **Initial value**: `0` |
| `WebkitTapHighlightColor` | `WebkitTapHighlightColor` | No | - | **`-webkit-tap-highlight-color`** is a non-standard CSS property that sets the color of the highlight that appears over a link while it's being tapped. The highlighting indicates to the user that their tap is being successfully recognized, and indicates which element they're tapping on. **Syntax**: `<color>` **Initial value**: `black` |
| `WebkitTextCombine` | `TextCombineUpright` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `none \| all \| [ digits <integer>? ]` **Initial value**: `none` |
| `WebkitTextDecorationColor` | `TextDecorationColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<color>` **Initial value**: `currentcolor` |
| `WebkitTextDecorationLine` | `TextDecorationLine` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `none \| [ underline \|\| overline \|\| line-through \|\| blink ] \| spelling-error \| grammar-error` **Initial value**: `none` |
| `WebkitTextDecorationSkip` | `TextDecorationSkip` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| [ objects \|\| [ spaces \| [ leading-spaces \|\| trailing-spaces ] ] \|\| edges \|\| box-decoration ]` **Initial value**: `objects` |
| `WebkitTextDecorationStyle` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "dashed" \| "dotted" \| "double" \| "solid" \| "wavy"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `solid \| double \| dotted \| dashed \| wavy` **Initial value**: `solid` |
| `WebkitTextEmphasisColor` | `TextEmphasisColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `<color>` **Initial value**: `currentcolor` |
| `WebkitTextEmphasisPosition` | `TextEmphasisPosition` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `auto \| [ over \| under ] && [ right \| left ]?` **Initial value**: `auto` |
| `WebkitTextEmphasisStyle` | `TextEmphasisStyle` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `none \| [ [ filled \| open ] \|\| [ dot \| circle \| double-circle \| triangle \| sesame ] ] \| <string>` **Initial value**: `none` |
| `WebkitTextFillColor` | `WebkitTextFillColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2016. **Syntax**: `<color>` **Initial value**: `currentcolor` |
| `WebkitTextOrientation` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "mixed" \| "sideways" \| "sideways-right" \| "upright"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2020. **Syntax**: `mixed \| upright \| sideways` **Initial value**: `mixed` |
| `WebkitTextSizeAdjust` | `TextSizeAdjust` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| auto \| <percentage>` **Initial value**: `auto` for smartphone browsers supporting inflation, `none` in other cases (and then not modifiable). |
| `WebkitTextStrokeColor` | `WebkitTextStrokeColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `<color>` **Initial value**: `currentcolor` |
| `WebkitTextStrokeWidth` | `WebkitTextStrokeWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `<length>` **Initial value**: `0` |
| `WebkitTextUnderlinePosition` | `TextUnderlinePosition` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `auto \| from-font \| [ under \|\| [ left \| right ] ]` **Initial value**: `auto` |
| `WebkitTouchCallout` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "default"` | No | - | The `-webkit-touch-callout` CSS property controls the display of the default callout shown when you touch and hold a touch target. **Syntax**: `default \| none` **Initial value**: `default` |
| `WebkitTransform` | `Transform` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| <transform-list>` **Initial value**: `none` |
| `WebkitTransformOrigin` | `TransformOrigin<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `[ <length-percentage> \| left \| center \| right \| top \| bottom ] \| [ [ <length-percentage> \| left \| center \| right ] && [ <length-percentage> \| top \| center \| bottom ] ] <length>?` **Initial value**: `50% 50% 0` |
| `WebkitTransformStyle` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "flat" \| "preserve-3d"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `flat \| preserve-3d` **Initial value**: `flat` |
| `WebkitTransitionDelay` | `TransitionDelay<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<time>#` **Initial value**: `0s` |
| `WebkitTransitionDuration` | `TransitionDuration<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<time>#` **Initial value**: `0s` |
| `WebkitTransitionProperty` | `TransitionProperty` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| <single-transition-property>#` **Initial value**: all |
| `WebkitTransitionTimingFunction` | `TransitionTimingFunction` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<easing-function>#` **Initial value**: `ease` |
| `WebkitUserModify` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "read-only" \| "read-write" \| "read-write-plaintext-only"` | No | - | **Syntax**: `read-only \| read-write \| read-write-plaintext-only` **Initial value**: `read-only` |
| `WebkitUserSelect` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "text" \| "all"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `auto \| text \| none \| all` **Initial value**: `auto` |
| `WebkitWritingMode` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "horizontal-tb" \| "sideways-lr" \| "sideways-rl" \| "vertical-lr" \| "vertical-rl"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `horizontal-tb \| vertical-rl \| vertical-lr \| sideways-rl \| sideways-lr` **Initial value**: `horizontal-tb` |
| `MozAnimation` | `Animation<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation>#` |
| `MozBorderImage` | `BorderImage` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<'border-image-source'> \|\| <'border-image-slice'> [ / <'border-image-width'> \| / <'border-image-width'>? / <'border-image-outset'> ]? \|\| <'border-image-repeat'>` |
| `MozColumnRule` | `ColumnRule<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<'column-rule-width'> \|\| <'column-rule-style'> \|\| <'column-rule-color'>` |
| `MozColumns` | `Columns<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<'column-width'> \|\| <'column-count'>` |
| `MozOutlineRadius` | `MozOutlineRadius<string \| number>` | No | - | **Syntax**: `<outline-radius>{1,4} [ / <outline-radius>{1,4} ]?` |
| `MozTransition` | `Transition<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-transition>#` |
| `msContentZoomLimit` | `MsContentZoomLimit` | No | - | **Syntax**: `<'-ms-content-zoom-limit-min'> <'-ms-content-zoom-limit-max'>` |
| `msContentZoomSnap` | `MsContentZoomSnap` | No | - | **Syntax**: `<'-ms-content-zoom-snap-type'> \|\| <'-ms-content-zoom-snap-points'>` |
| `msFlex` | `Flex<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| [ <'flex-grow'> <'flex-shrink'>? \|\| <'flex-basis'> ]` |
| `msScrollLimit` | `MsScrollLimit` | No | - | **Syntax**: `<'-ms-scroll-limit-x-min'> <'-ms-scroll-limit-y-min'> <'-ms-scroll-limit-x-max'> <'-ms-scroll-limit-y-max'>` |
| `msScrollSnapX` | `MsScrollSnapX` | No | - | **Syntax**: `<'-ms-scroll-snap-type'> <'-ms-scroll-snap-points-x'>` |
| `msScrollSnapY` | `MsScrollSnapY` | No | - | **Syntax**: `<'-ms-scroll-snap-type'> <'-ms-scroll-snap-points-y'>` |
| `msTransition` | `Transition<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-transition>#` |
| `WebkitAnimation` | `Animation<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation>#` |
| `WebkitBorderBefore` | `WebkitBorderBefore<string \| number>` | No | - | The **`-webkit-border-before`** CSS property is a shorthand property for setting the individual logical block start border property values in a single place in the style sheet. **Syntax**: `<'border-width'> \|\| <'border-style'> \|\| <color>` |
| `WebkitBorderImage` | `BorderImage` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<'border-image-source'> \|\| <'border-image-slice'> [ / <'border-image-width'> \| / <'border-image-width'>? / <'border-image-outset'> ]? \|\| <'border-image-repeat'>` |
| `WebkitBorderRadius` | `BorderRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,4} [ / <length-percentage [0,∞]>{1,4} ]?` |
| `WebkitColumnRule` | `ColumnRule<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<'column-rule-width'> \|\| <'column-rule-style'> \|\| <'column-rule-color'>` |
| `WebkitColumns` | `Columns<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<'column-width'> \|\| <'column-count'>` |
| `WebkitFlex` | `Flex<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| [ <'flex-grow'> <'flex-shrink'>? \|\| <'flex-basis'> ]` |
| `WebkitFlexFlow` | `FlexFlow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<'flex-direction'> \|\| <'flex-wrap'>` |
| `WebkitMask` | `WebkitMask<string \| number>` | No | - | Since December 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers. **Syntax**: `[ <mask-reference> \|\| <position> [ / <bg-size> ]? \|\| <repeat-style> \|\| [ <visual-box> \| border \| padding \| content \| text ] \|\| [ <visual-box> \| border \| padding \| content ] ]#` |
| `WebkitMaskBoxImage` | `MaskBorder` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `<'mask-border-source'> \|\| <'mask-border-slice'> [ / <'mask-border-width'>? [ / <'mask-border-outset'> ]? ]? \|\| <'mask-border-repeat'> \|\| <'mask-border-mode'>` |
| `WebkitTextEmphasis` | `TextEmphasis` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022. **Syntax**: `<'text-emphasis-style'> \|\| <'text-emphasis-color'>` |
| `WebkitTextStroke` | `WebkitTextStroke<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017. **Syntax**: `<length> \|\| <color>` |
| `WebkitTransition` | `Transition<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-transition>#` |
| `boxAlign` | `"start" \| "center" \| "end" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "baseline" \| "stretch"` | No | - | The **`box-align`** CSS property specifies how an element aligns its contents across its layout in a perpendicular direction. The effect of the property is only visible if there is extra space in the box. **Syntax**: `start \| center \| end \| baseline \| stretch` **Initial value**: `stretch` @deprecated |
| `boxDirection` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "reverse" \| "normal"` | No | - | The **`box-direction`** CSS property specifies whether a box lays out its contents normally (from the top or left edge), or in reverse (from the bottom or right edge). **Syntax**: `normal \| reverse \| inherit` **Initial value**: `normal` @deprecated |
| `boxFlex` | `BoxFlex` | No | - | The **`-moz-box-flex`** and **`-webkit-box-flex`** CSS properties specify how a `-moz-box` or `-webkit-box` grows to fill the box that contains it, in the direction of the containing box's layout. **Syntax**: `<number>` **Initial value**: `0` @deprecated |
| `boxFlexGroup` | `BoxFlexGroup` | No | - | The **`box-flex-group`** CSS property assigns the flexbox's child elements to a flex group. **Syntax**: `<integer>` **Initial value**: `1` @deprecated |
| `boxLines` | `"multiple" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "single"` | No | - | The **`box-lines`** CSS property determines whether the box may have a single or multiple lines (rows for horizontally oriented boxes, columns for vertically oriented boxes). **Syntax**: `single \| multiple` **Initial value**: `single` @deprecated |
| `boxOrdinalGroup` | `BoxOrdinalGroup` | No | - | The **`box-ordinal-group`** CSS property assigns the flexbox's child elements to an ordinal group. **Syntax**: `<integer>` **Initial value**: `1` @deprecated |
| `boxOrient` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "horizontal" \| "vertical" \| "block-axis" \| "inline-axis"` | No | - | The **`box-orient`** CSS property sets whether an element lays out its contents horizontally or vertically. **Syntax**: `horizontal \| vertical \| inline-axis \| block-axis \| inherit` **Initial value**: `inline-axis` @deprecated |
| `boxPack` | `"start" \| "center" \| "end" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "justify"` | No | - | The **`-moz-box-pack`** and **`-webkit-box-pack`** CSS properties specify how a `-moz-box` or `-webkit-box` packs its contents in the direction of its layout. The effect of this is only visible if there is extra space in the box. **Syntax**: `start \| center \| end \| justify` **Initial value**: `start` @deprecated |
| `fontStretch` | `FontStretch` | No | - | The **`font-stretch`** CSS property selects a normal, condensed, or expanded face from a font. **Syntax**: `<font-stretch-absolute>` **Initial value**: `normal` @deprecated |
| `gridColumnGap` | `GridColumnGap<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage>` **Initial value**: `0` @deprecated |
| `gridGap` | `GridGap<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `<'grid-row-gap'> <'grid-column-gap'>?` @deprecated |
| `gridRowGap` | `GridRowGap<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017. **Syntax**: `<length-percentage>` **Initial value**: `0` @deprecated |
| `imeMode` | `"disabled" \| "auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "active" \| "inactive"` | No | - | **Syntax**: `auto \| normal \| active \| inactive \| disabled` **Initial value**: `auto` @deprecated |
| `insetArea` | `PositionArea` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| <position-area>` **Initial value**: `none` @deprecated |
| `offsetBlock` | `InsetBlock<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'top'>{1,2}` @deprecated |
| `offsetBlockEnd` | `InsetBlockEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'top'>` **Initial value**: `auto` @deprecated |
| `offsetBlockStart` | `InsetBlockStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'top'>` **Initial value**: `auto` @deprecated |
| `offsetInline` | `InsetInline<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'top'>{1,2}` @deprecated |
| `offsetInlineEnd` | `InsetInlineEnd<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'top'>` **Initial value**: `auto` @deprecated |
| `offsetInlineStart` | `InsetInlineStart<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021. **Syntax**: `<'top'>` **Initial value**: `auto` @deprecated |
| `pageBreakAfter` | `"auto" \| "right" \| "left" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "always" \| "avoid" \| "recto" \| "verso"` | No | - | The **`page-break-after`** CSS property adjusts page breaks _after_ the current element. **Syntax**: `auto \| always \| avoid \| left \| right \| recto \| verso` **Initial value**: `auto` @deprecated |
| `pageBreakBefore` | `"auto" \| "right" \| "left" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "always" \| "avoid" \| "recto" \| "verso"` | No | - | The **`page-break-before`** CSS property adjusts page breaks _before_ the current element. **Syntax**: `auto \| always \| avoid \| left \| right \| recto \| verso` **Initial value**: `auto` @deprecated |
| `pageBreakInside` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "avoid"` | No | - | The **`page-break-inside`** CSS property adjusts page breaks _inside_ the current element. **Syntax**: `auto \| avoid` **Initial value**: `auto` @deprecated |
| `positionTryOptions` | `PositionTryFallbacks` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `none \| [ [<dashed-ident> \|\| <try-tactic>] \| <'position-area'> ]#` **Initial value**: `none` @deprecated |
| `scrollSnapCoordinate` | `ScrollSnapCoordinate<string \| number>` | No | - | **Syntax**: `none \| <position>#` **Initial value**: `none` @deprecated |
| `scrollSnapDestination` | `ScrollSnapDestination<string \| number>` | No | - | **Syntax**: `<position>` **Initial value**: `0px 0px` @deprecated |
| `scrollSnapPointsX` | `ScrollSnapPointsX` | No | - | **Syntax**: `none \| repeat( <length-percentage> )` **Initial value**: `none` @deprecated |
| `scrollSnapPointsY` | `ScrollSnapPointsY` | No | - | **Syntax**: `none \| repeat( <length-percentage> )` **Initial value**: `none` @deprecated |
| `scrollSnapTypeX` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "mandatory" \| "proximity"` | No | - | **Syntax**: `none \| mandatory \| proximity` **Initial value**: `none` @deprecated |
| `scrollSnapTypeY` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "mandatory" \| "proximity"` | No | - | **Syntax**: `none \| mandatory \| proximity` **Initial value**: `none` @deprecated |
| `KhtmlBoxAlign` | `"start" \| "center" \| "end" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "baseline" \| "stretch"` | No | - | The **`box-align`** CSS property specifies how an element aligns its contents across its layout in a perpendicular direction. The effect of the property is only visible if there is extra space in the box. **Syntax**: `start \| center \| end \| baseline \| stretch` **Initial value**: `stretch` @deprecated |
| `KhtmlBoxDirection` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "reverse" \| "normal"` | No | - | The **`box-direction`** CSS property specifies whether a box lays out its contents normally (from the top or left edge), or in reverse (from the bottom or right edge). **Syntax**: `normal \| reverse \| inherit` **Initial value**: `normal` @deprecated |
| `KhtmlBoxFlex` | `BoxFlex` | No | - | The **`-moz-box-flex`** and **`-webkit-box-flex`** CSS properties specify how a `-moz-box` or `-webkit-box` grows to fill the box that contains it, in the direction of the containing box's layout. **Syntax**: `<number>` **Initial value**: `0` @deprecated |
| `KhtmlBoxFlexGroup` | `BoxFlexGroup` | No | - | The **`box-flex-group`** CSS property assigns the flexbox's child elements to a flex group. **Syntax**: `<integer>` **Initial value**: `1` @deprecated |
| `KhtmlBoxLines` | `"multiple" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "single"` | No | - | The **`box-lines`** CSS property determines whether the box may have a single or multiple lines (rows for horizontally oriented boxes, columns for vertically oriented boxes). **Syntax**: `single \| multiple` **Initial value**: `single` @deprecated |
| `KhtmlBoxOrdinalGroup` | `BoxOrdinalGroup` | No | - | The **`box-ordinal-group`** CSS property assigns the flexbox's child elements to an ordinal group. **Syntax**: `<integer>` **Initial value**: `1` @deprecated |
| `KhtmlBoxOrient` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "horizontal" \| "vertical" \| "block-axis" \| "inline-axis"` | No | - | The **`box-orient`** CSS property sets whether an element lays out its contents horizontally or vertically. **Syntax**: `horizontal \| vertical \| inline-axis \| block-axis \| inherit` **Initial value**: `inline-axis` @deprecated |
| `KhtmlBoxPack` | `"start" \| "center" \| "end" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "justify"` | No | - | The **`-moz-box-pack`** and **`-webkit-box-pack`** CSS properties specify how a `-moz-box` or `-webkit-box` packs its contents in the direction of its layout. The effect of this is only visible if there is extra space in the box. **Syntax**: `start \| center \| end \| justify` **Initial value**: `start` @deprecated |
| `KhtmlLineBreak` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "strict" \| "anywhere" \| "loose"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020. **Syntax**: `auto \| loose \| normal \| strict \| anywhere` **Initial value**: `auto` @deprecated |
| `KhtmlOpacity` | `Opacity` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<opacity-value>` **Initial value**: `1` @deprecated |
| `KhtmlUserSelect` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "text" \| "all" \| "-moz-none"` | No | - | This feature is not Baseline because it does not work in some of the most widely-used browsers. **Syntax**: `auto \| text \| none \| all` **Initial value**: `auto` @deprecated |
| `MozBackgroundClip` | `BackgroundClip` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<bg-clip>#` **Initial value**: `border-box` @deprecated |
| `MozBackgroundOrigin` | `BackgroundOrigin` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<visual-box>#` **Initial value**: `padding-box` @deprecated |
| `MozBackgroundSize` | `BackgroundSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<bg-size>#` **Initial value**: `auto auto` @deprecated |
| `MozBorderRadius` | `BorderRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,4} [ / <length-percentage [0,∞]>{1,4} ]?` @deprecated |
| `MozBorderRadiusBottomleft` | `BorderBottomLeftRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,2}` **Initial value**: `0` @deprecated |
| `MozBorderRadiusBottomright` | `BorderBottomRightRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,2}` **Initial value**: `0` @deprecated |
| `MozBorderRadiusTopleft` | `BorderTopLeftRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,2}` **Initial value**: `0` @deprecated |
| `MozBorderRadiusTopright` | `BorderTopRightRadius<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<length-percentage [0,∞]>{1,2}` **Initial value**: `0` @deprecated |
| `MozBoxAlign` | `"start" \| "center" \| "end" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "baseline" \| "stretch"` | No | - | The **`box-align`** CSS property specifies how an element aligns its contents across its layout in a perpendicular direction. The effect of the property is only visible if there is extra space in the box. **Syntax**: `start \| center \| end \| baseline \| stretch` **Initial value**: `stretch` @deprecated |
| `MozBoxDirection` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "reverse" \| "normal"` | No | - | The **`box-direction`** CSS property specifies whether a box lays out its contents normally (from the top or left edge), or in reverse (from the bottom or right edge). **Syntax**: `normal \| reverse \| inherit` **Initial value**: `normal` @deprecated |
| `MozBoxFlex` | `BoxFlex` | No | - | The **`-moz-box-flex`** and **`-webkit-box-flex`** CSS properties specify how a `-moz-box` or `-webkit-box` grows to fill the box that contains it, in the direction of the containing box's layout. **Syntax**: `<number>` **Initial value**: `0` @deprecated |
| `MozBoxOrdinalGroup` | `BoxOrdinalGroup` | No | - | The **`box-ordinal-group`** CSS property assigns the flexbox's child elements to an ordinal group. **Syntax**: `<integer>` **Initial value**: `1` @deprecated |
| `MozBoxOrient` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "horizontal" \| "vertical" \| "block-axis" \| "inline-axis"` | No | - | The **`box-orient`** CSS property sets whether an element lays out its contents horizontally or vertically. **Syntax**: `horizontal \| vertical \| inline-axis \| block-axis \| inherit` **Initial value**: `inline-axis` @deprecated |
| `MozBoxPack` | `"start" \| "center" \| "end" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "justify"` | No | - | The **`-moz-box-pack`** and **`-webkit-box-pack`** CSS properties specify how a `-moz-box` or `-webkit-box` packs its contents in the direction of its layout. The effect of this is only visible if there is extra space in the box. **Syntax**: `start \| center \| end \| justify` **Initial value**: `start` @deprecated |
| `MozBoxShadow` | `BoxShadow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `none \| <shadow>#` **Initial value**: `none` @deprecated |
| `MozColumnCount` | `ColumnCount` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `<integer> \| auto` **Initial value**: `auto` @deprecated |
| `MozColumnFill` | `"auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "balance"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017. **Syntax**: `auto \| balance` **Initial value**: `balance` @deprecated |
| `MozFloatEdge` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "border-box" \| "content-box" \| "padding-box" \| "margin-box"` | No | - | The non-standard **`-moz-float-edge`** CSS property specifies whether the height and width properties of the element include the margin, border, or padding thickness. **Syntax**: `border-box \| content-box \| margin-box \| padding-box` **Initial value**: `content-box` @deprecated |
| `MozForceBrokenImageIcon` | `MozForceBrokenImageIcon` | No | - | The **`-moz-force-broken-image-icon`** extended CSS property can be used to force the broken image icon to be shown even when a broken image has an `alt` attribute. **Syntax**: `0 \| 1` **Initial value**: `0` @deprecated |
| `MozOpacity` | `Opacity` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<opacity-value>` **Initial value**: `1` @deprecated |
| `MozOutline` | `Outline<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2023. **Syntax**: `<'outline-width'> \|\| <'outline-style'> \|\| <'outline-color'>` @deprecated |
| `MozOutlineColor` | `OutlineColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| <color>` **Initial value**: `auto` @deprecated |
| `MozOutlineStyle` | `"auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "inset" \| "dashed" \| "dotted" \| "double" \| "groove" \| "outset" \| "ridge" \| "solid"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `auto \| <outline-line-style>` **Initial value**: `none` @deprecated |
| `MozOutlineWidth` | `OutlineWidth<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<line-width>` **Initial value**: `medium` @deprecated |
| `MozTextAlignLast` | `"auto" \| "right" \| "left" \| "start" \| "center" \| "end" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "justify"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022. **Syntax**: `auto \| start \| end \| left \| right \| center \| justify` **Initial value**: `auto` @deprecated |
| `MozTextDecorationColor` | `TextDecorationColor` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<color>` **Initial value**: `currentcolor` @deprecated |
| `MozTextDecorationLine` | `TextDecorationLine` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `none \| [ underline \|\| overline \|\| line-through \|\| blink ] \| spelling-error \| grammar-error` **Initial value**: `none` @deprecated |
| `MozTextDecorationStyle` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "dashed" \| "dotted" \| "double" \| "solid" \| "wavy"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `solid \| double \| dotted \| dashed \| wavy` **Initial value**: `solid` @deprecated |
| `MozTransitionDelay` | `TransitionDelay<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<time>#` **Initial value**: `0s` @deprecated |
| `MozTransitionDuration` | `TransitionDuration<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<time>#` **Initial value**: `0s` @deprecated |
| `MozTransitionProperty` | `TransitionProperty` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| <single-transition-property>#` **Initial value**: all @deprecated |
| `MozTransitionTimingFunction` | `TransitionTimingFunction` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<easing-function>#` **Initial value**: `ease` @deprecated |
| `MozUserFocus` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "ignore" \| "select-after" \| "select-all" \| "select-before" \| "select-menu" \| "select-same"` | No | - | The **`-moz-user-focus`** CSS property is used to indicate whether an element can have the focus. **Syntax**: `ignore \| normal \| select-after \| select-before \| select-menu \| select-same \| select-all \| none` **Initial value**: `none` @deprecated |
| `MozUserInput` | `"disabled" \| "auto" \| "none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "enabled"` | No | - | In Mozilla applications, **`-moz-user-input`** determines if an element will accept user input. **Syntax**: `auto \| none \| enabled \| disabled` **Initial value**: `auto` @deprecated |
| `msImeMode` | `"disabled" \| "auto" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "normal" \| "active" \| "inactive"` | No | - | **Syntax**: `auto \| normal \| active \| inactive \| disabled` **Initial value**: `auto` @deprecated |
| `OAnimation` | `Animation<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation>#` @deprecated |
| `OAnimationDelay` | `AnimationDelay<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<time>#` **Initial value**: `0s` @deprecated |
| `OAnimationDirection` | `AnimationDirection` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-direction>#` **Initial value**: `normal` @deprecated |
| `OAnimationDuration` | `AnimationDuration<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `[ auto \| <time [0s,∞]> ]#` **Initial value**: `0s` @deprecated |
| `OAnimationFillMode` | `AnimationFillMode` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-fill-mode>#` **Initial value**: `none` @deprecated |
| `OAnimationIterationCount` | `AnimationIterationCount` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-iteration-count>#` **Initial value**: `1` @deprecated |
| `OAnimationName` | `AnimationName` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `[ none \| <keyframes-name> ]#` **Initial value**: `none` @deprecated |
| `OAnimationPlayState` | `AnimationPlayState` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-animation-play-state>#` **Initial value**: `running` @deprecated |
| `OAnimationTimingFunction` | `AnimationTimingFunction` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<easing-function>#` **Initial value**: `ease` @deprecated |
| `OBackgroundSize` | `BackgroundSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<bg-size>#` **Initial value**: `auto auto` @deprecated |
| `OBorderImage` | `BorderImage` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `<'border-image-source'> \|\| <'border-image-slice'> [ / <'border-image-width'> \| / <'border-image-width'>? / <'border-image-outset'> ]? \|\| <'border-image-repeat'>` @deprecated |
| `OObjectFit` | `"none" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "fill" \| "contain" \| "cover" \| "scale-down"` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `fill \| contain \| cover \| none \| scale-down` **Initial value**: `fill` @deprecated |
| `OObjectPosition` | `ObjectPosition<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020. **Syntax**: `<position>` **Initial value**: `50% 50%` @deprecated |
| `OTabSize` | `TabSize<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since August 2021. **Syntax**: `<integer> \| <length>` **Initial value**: `8` @deprecated |
| `OTextOverflow` | `TextOverflow` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. **Syntax**: `[ clip \| ellipsis \| <string> ]{1,2}` **Initial value**: `clip` @deprecated |
| `OTransform` | `Transform` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| <transform-list>` **Initial value**: `none` @deprecated |
| `OTransformOrigin` | `TransformOrigin<string \| number>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `[ <length-percentage> \| left \| center \| right \| top \| bottom ] \| [ [ <length-percentage> \| left \| center \| right ] && [ <length-percentage> \| top \| center \| bottom ] ] <length>?` **Initial value**: `50% 50% 0` @deprecated |
| `OTransition` | `Transition<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<single-transition>#` @deprecated |
| `OTransitionDelay` | `TransitionDelay<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<time>#` **Initial value**: `0s` @deprecated |
| `OTransitionDuration` | `TransitionDuration<string & {}>` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<time>#` **Initial value**: `0s` @deprecated |
| `OTransitionProperty` | `TransitionProperty` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `none \| <single-transition-property>#` **Initial value**: all @deprecated |
| `OTransitionTimingFunction` | `TransitionTimingFunction` | No | - | This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015. **Syntax**: `<easing-function>#` **Initial value**: `ease` @deprecated |
| `WebkitBoxAlign` | `"start" \| "center" \| "end" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "baseline" \| "stretch"` | No | - | The **`box-align`** CSS property specifies how an element aligns its contents across its layout in a perpendicular direction. The effect of the property is only visible if there is extra space in the box. **Syntax**: `start \| center \| end \| baseline \| stretch` **Initial value**: `stretch` @deprecated |
| `WebkitBoxDirection` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "reverse" \| "normal"` | No | - | The **`box-direction`** CSS property specifies whether a box lays out its contents normally (from the top or left edge), or in reverse (from the bottom or right edge). **Syntax**: `normal \| reverse \| inherit` **Initial value**: `normal` @deprecated |
| `WebkitBoxFlex` | `BoxFlex` | No | - | The **`-moz-box-flex`** and **`-webkit-box-flex`** CSS properties specify how a `-moz-box` or `-webkit-box` grows to fill the box that contains it, in the direction of the containing box's layout. **Syntax**: `<number>` **Initial value**: `0` @deprecated |
| `WebkitBoxFlexGroup` | `BoxFlexGroup` | No | - | The **`box-flex-group`** CSS property assigns the flexbox's child elements to a flex group. **Syntax**: `<integer>` **Initial value**: `1` @deprecated |
| `WebkitBoxLines` | `"multiple" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "single"` | No | - | The **`box-lines`** CSS property determines whether the box may have a single or multiple lines (rows for horizontally oriented boxes, columns for vertically oriented boxes). **Syntax**: `single \| multiple` **Initial value**: `single` @deprecated |
| `WebkitBoxOrdinalGroup` | `BoxOrdinalGroup` | No | - | The **`box-ordinal-group`** CSS property assigns the flexbox's child elements to an ordinal group. **Syntax**: `<integer>` **Initial value**: `1` @deprecated |
| `WebkitBoxOrient` | `"-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "horizontal" \| "vertical" \| "block-axis" \| "inline-axis"` | No | - | The **`box-orient`** CSS property sets whether an element lays out its contents horizontally or vertically. **Syntax**: `horizontal \| vertical \| inline-axis \| block-axis \| inherit` **Initial value**: `inline-axis` @deprecated |
| `WebkitBoxPack` | `"start" \| "center" \| "end" \| "-moz-initial" \| "inherit" \| "initial" \| "revert" \| "revert-layer" \| "unset" \| "justify"` | No | - | The **`-moz-box-pack`** and **`-webkit-box-pack`** CSS properties specify how a `-moz-box` or `-webkit-box` packs its contents in the direction of its layout. The effect of this is only visible if there is extra space in the box. **Syntax**: `start \| center \| end \| justify` **Initial value**: `start` @deprecated |
| `data-hook` | `string` | No | - | Accepts HTML attributes that can be used in the tests @deprecated use dataHook instead |
| `style` | `CSSProperties` | No | - | Sets object of CSS styles |