🗃️💄 Ethan's CSS Property Reference
Here's every CSS property. Or at least 99.5% of them, and you get to sort and filter them and look them up by different characteristics. I tried to be as accurate as possible; this is the same dataset that the CSS Property Analyzer uses, and after I had made that, I figured why not make something like this too? I hope you find it useful.
--* Custom Properties
Family pattern for CSS custom properties (variables) whose names begin with two hyphens.
-moz-appearance Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS appearance feature.
Is Mozilla's prefixed form of appearance. It was used to request or suppress native widget styling before the unprefixed property became the normal cross-browser form.
-moz-binding Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS binding feature.
Was a Mozilla-specific property for attaching XBL bindings to elements. XBL was removed from Firefox, making this property obsolete.
-moz-border-bottom-colors Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS border bottom colors feature.
-moz-border-left-colors Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS border left colors feature.
-moz-border-right-colors Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS border right colors feature.
-moz-border-top-colors Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS border top colors feature.
-moz-box-align Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box align feature.
-moz-box-direction Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box direction feature.
-moz-box-flex Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box flex feature.
Belongs to Mozilla's prefixed implementation of the old 2009 flexbox model. It predates modern flex-grow and should mainly be expected in legacy stylesheets.
-moz-box-ordinal-group Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box ordinal group feature.
-moz-box-orient Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box orient feature.
-moz-box-pack Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box pack feature.
-moz-box-sizing Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box sizing feature.
-moz-context-properties Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS context properties feature.
-moz-float-edge Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS float edge feature.
Was a Mozilla-specific layout property affecting how floats contributed to box edges. It is obsolete and not relevant to modern cross-browser CSS.
-moz-force-broken-image-icon Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS force broken image icon feature.
Was a Firefox-specific property that could force display of a broken-image icon for failed images. It is obscure, non-standard, and mostly of historical interest.
-moz-image-region Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS image region feature.
Was a Mozilla-specific property for selecting a rectangular region from an image, commonly used in old XUL interface sprites. It is obsolete outside historical Firefox/XUL code.
-moz-opacity Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS opacity feature.
-moz-orient Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS orient feature.
-moz-osx-font-smoothing Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS osx font smoothing feature.
Is a non-standard Firefox-on-macOS property used to influence font smoothing. It is generally encountered in old cross-browser typography recipes rather than standards-based CSS.
-moz-outline Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS outline feature.
-moz-outline-color Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS outline color feature.
-moz-outline-radius Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS outline radius feature.
-moz-outline-radius-bottomleft Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS outline radius bottomleft feature.
-moz-outline-radius-bottomright Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS outline radius bottomright feature.
-moz-outline-radius-topleft Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS outline radius topleft feature.
-moz-outline-radius-topright Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS outline radius topright feature.
-moz-outline-style Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS outline style feature.
-moz-outline-width Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS outline width feature.
-moz-tab-size Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS tab size feature.
-moz-text-size-adjust Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS text size adjust feature.
-moz-transform Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS transform feature.
-moz-transform-origin Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS transform origin feature.
-moz-transition Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS transition feature.
-moz-user-focus Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS user focus feature.
-moz-user-input Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS user input feature.
-moz-user-modify Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS user modify feature.
-moz-user-select Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS user select feature.
Is Mozilla's prefixed form of user-select. It appears in older compatibility code that disables or controls text selection in Firefox.
-ms-accelerator Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS accelerator feature.
Was an Internet Explorer-specific property controlling visual indication of keyboard accelerator keys. It is obsolete and non-standard.
-ms-block-progression Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS block progression feature.
Was a Microsoft-prefixed precursor to writing-mode for controlling block flow direction. Modern CSS uses writing-mode.
-ms-content-zoom-chaining Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS content zoom chaining feature.
-ms-content-zoom-limit Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS content zoom limit feature.
Was a shorthand for minimum and maximum content zoom limits in legacy Microsoft browsers. It is obsolete with the old IE/EdgeHTML zoom model.
-ms-content-zoom-limit-max Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS content zoom limit max feature.
Set the maximum allowed content zoom level in old Microsoft touch implementations. It is non-standard and obsolete.
-ms-content-zoom-limit-min Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS content zoom limit min feature.
Set the minimum allowed content zoom level in old Microsoft touch implementations. It belongs to legacy IE and EdgeHTML behavior.
-ms-content-zoom-snap Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS content zoom snap feature.
Was a shorthand for snap type and snap points in Microsoft's old content-zooming model. Modern browsers use different scroll-snap and viewport mechanisms.
-ms-content-zoom-snap-points Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS content zoom snap points feature.
Defined zoom snap points in old Microsoft browser implementations. It is non-standard and obsolete.
-ms-content-zoom-snap-type Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS content zoom snap type feature.
Controlled how zooming snapped to predefined levels in old Microsoft browsers. It is part of the retired EdgeHTML/IE feature set.
-ms-content-zooming Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS content zooming feature.
Controlled touch zoom behavior in legacy Microsoft browsers. It belonged to the old -ms touch and viewport feature set.
-ms-filter Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS filter feature.
Was an Internet Explorer-specific property used for proprietary visual filters and opacity effects. Standard opacity, filter, transforms, and other CSS properties replaced those behaviors.
-ms-flex Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex feature.
-ms-flex-align Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex align feature.
-ms-flex-direction Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex direction feature.
-ms-flex-flow Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex flow feature.
-ms-flex-item-align Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex item align feature.
-ms-flex-line-pack Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex line pack feature.
-ms-flex-negative Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex negative feature.
-ms-flex-order Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex order feature.
-ms-flex-pack Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex pack feature.
-ms-flex-positive Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex positive feature.
-ms-flex-preferred-size Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex preferred size feature.
-ms-flex-wrap Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex wrap feature.
-ms-grid-column Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS grid column feature.
Set the starting grid column in Microsoft's early prefixed grid implementation. Modern grid uses grid-column-start or grid-column.
-ms-grid-column-align Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS grid column align feature.
Controlled alignment of a grid item within its column in Microsoft's old grid model. Modern grid uses justify-self and related alignment properties.
-ms-grid-column-span Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS grid column span feature.
Set how many columns an item spanned in the old Microsoft grid implementation. Modern grid uses grid-column with span syntax.
-ms-grid-columns Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS grid columns feature.
Defined column tracks in Microsoft's prefixed grid implementation. Modern CSS uses grid-template-columns.
-ms-grid-row Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS grid row feature.
Set the starting grid row in Microsoft's early grid implementation. Modern grid uses grid-row-start or grid-row.
-ms-grid-row-align Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS grid row align feature.
Controlled alignment of a grid item within its row in the old Microsoft grid model. Modern grid uses align-self and related alignment properties.
-ms-grid-row-span Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS grid row span feature.
Set how many rows an item spanned in Microsoft's prefixed grid. Modern grid uses grid-row with span syntax.
-ms-grid-rows Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS grid rows feature.
Defined row tracks in Microsoft's old prefixed grid implementation. Modern CSS uses grid-template-rows.
-ms-high-contrast-adjust Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS high contrast adjust feature.
Controlled whether Internet Explorer and legacy Edge modified an element in high-contrast mode. forced-color-adjust is the modern standardized replacement.
-ms-hyphenate-limit-chars Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS hyphenate limit chars feature.
Was Microsoft's prefixed form of advanced hyphenation character limits. Modern implementations use standardized hyphenate-limit-chars where supported.
-ms-hyphenate-limit-lines Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS hyphenate limit lines feature.
Was a Microsoft-specific property limiting consecutive hyphenated lines. It belongs to old IE and EdgeHTML typography support.
-ms-hyphenate-limit-zone Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS hyphenate limit zone feature.
Was a Microsoft-specific hyphenation control that defined a zone near the line edge where hyphenation could occur. It is obsolete.
-ms-ime-align Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS ime align feature.
Was a Microsoft-specific property related to Input Method Editor positioning. It is obsolete and not part of standard CSS.
-ms-overflow-style Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS overflow style feature.
Controls scrollbar presentation in older Microsoft browser engines. The value none was commonly used to hide scrollbars in Internet Explorer and legacy Edge while preserving scrolling.
-ms-scroll-chaining Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS scroll chaining feature.
Controlled whether scroll gestures chained from one scrollable element to an ancestor in old Microsoft browsers. overscroll-behavior is the modern standard mechanism for similar behavior.
-ms-scroll-limit Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS scroll limit feature.
Was a shorthand for constraining scroll extents in old Microsoft browser implementations. It is obsolete.
-ms-scroll-limit-x-max Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS scroll limit x max feature.
Set the maximum horizontal scroll extent in legacy Microsoft browsers. It is non-standard and obsolete.
-ms-scroll-limit-x-min Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS scroll limit x min feature.
Set the minimum horizontal scroll extent in legacy Microsoft browsers. It belongs to the old -ms scrolling feature set.
-ms-scroll-limit-y-max Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS scroll limit y max feature.
Set the maximum vertical scroll extent in legacy Microsoft browsers. It is obsolete.
-ms-scroll-limit-y-min Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS scroll limit y min feature.
Set the minimum vertical scroll extent in legacy Microsoft browsers. It is non-standard.
-ms-scroll-rails Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS scroll rails feature.
Controlled whether scrolling was constrained to a dominant axis in old Microsoft touch implementations. It is obsolete.
-ms-scroll-snap-points-x Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS scroll snap points x feature.
Defined horizontal scroll snap points in Microsoft's pre-standard scroll snap implementation. Modern CSS uses scroll-snap-type and snap alignment properties.
-ms-scroll-snap-points-y Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS scroll snap points y feature.
Defined vertical scroll snap points in old Microsoft browsers. It was replaced by the standardized scroll snap model.
-ms-scroll-snap-type Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS scroll snap type feature.
Controlled scroll snap behavior in Microsoft's old prefixed implementation. Modern CSS uses scroll-snap-type.
-ms-scroll-snap-x Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS scroll snap x feature.
Was a shorthand for horizontal snap behavior in legacy Microsoft browsers. It is obsolete.
-ms-scroll-snap-y Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS scroll snap y feature.
Was a shorthand for vertical snap behavior in legacy Microsoft browsers. It is obsolete.
-ms-scroll-translation Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS scroll translation feature.
Controlled how touch scrolling interacted with element transforms in old Microsoft browser engines. It is a legacy, non-standard property.
-ms-text-autospace Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS text autospace feature.
Was Microsoft's prefixed implementation of automatic spacing rules for East Asian text. Newer standards use text-autospace.
-ms-touch-action Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS touch action feature.
-ms-touch-select Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS touch select feature.
Controlled touch text selection behavior in old Microsoft browsers. It is obsolete and non-standard.
-ms-user-select Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS user select feature.
Is Microsoft's prefixed form of user-select used in Internet Explorer and older Edge. Modern browsers use the unprefixed property.
-ms-wrap-flow Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS wrap flow feature.
Was part of Microsoft's implementation of CSS Exclusions and controlled how inline content flowed around positioned exclusion elements. The feature never became mainstream.
-ms-wrap-margin Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS wrap margin feature.
Set extra spacing around an exclusion shape in Microsoft's old CSS Exclusions implementation. It is obsolete.
-ms-wrap-through Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS wrap through feature.
Controlled whether content could flow through an exclusion element in Microsoft's experimental exclusion model. It is historical and non-standard.
-ms-writing-mode Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS writing mode feature.
-o-background-size Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS background size feature.
-o-border-image Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS border image feature.
-o-object-fit Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS object fit feature.
-o-object-position Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS object position feature.
-o-tab-size Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS tab size feature.
-o-text-overflow Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS text overflow feature.
-o-transform Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS transform feature.
-o-transform-origin Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS transform origin feature.
-o-transition Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS transition feature.
-webkit-animation Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS animation feature.
-webkit-animation-delay Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS animation delay feature.
-webkit-animation-direction Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS animation direction feature.
-webkit-animation-duration Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS animation duration feature.
-webkit-animation-fill-mode Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS animation fill mode feature.
-webkit-animation-iteration-count Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS animation iteration count feature.
-webkit-animation-name Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS animation name feature.
-webkit-animation-play-state Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS animation play state feature.
-webkit-animation-timing-function Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS animation timing function feature.
-webkit-appearance Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS appearance feature.
Is the prefixed WebKit form of appearance and controls native platform styling of certain controls and widgets. It remains common in older stylesheets and compatibility code even where unprefixed appearance is supported.
-webkit-backface-visibility Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS backface visibility feature.
-webkit-background-clip Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS background clip feature.
Is the prefixed form of background-clip used by older WebKit-derived browsers. It remains especially familiar from gradient-text recipes that use the text clipping value.
-webkit-background-origin Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS background origin feature.
-webkit-background-size Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS background size feature.
-webkit-border-before Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS border before feature.
-webkit-border-bottom-left-radius Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS border bottom left radius feature.
-webkit-border-bottom-right-radius Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS border bottom right radius feature.
-webkit-border-image Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS border image feature.
-webkit-border-radius Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS border radius feature.
-webkit-border-top-left-radius Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS border top left radius feature.
-webkit-border-top-right-radius Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS border top right radius feature.
-webkit-box-align Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box align feature.
-webkit-box-direction Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box direction feature.
-webkit-box-flex Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box flex feature.
Belongs to the older prefixed WebKit flexbox model and controls how an old-style flex item expands. Modern flexbox uses flex-grow, flex-shrink, flex-basis, and the flex shorthand instead.
-webkit-box-ordinal-group Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box ordinal group feature.
-webkit-box-orient Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box orient feature.
Sets the orientation of children in the old WebKit box layout model. It survives in some line-clamping recipes but is otherwise a legacy precursor to modern flex-direction.
-webkit-box-pack Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box pack feature.
-webkit-box-reflect Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box reflect feature.
Creates a reflected copy of an element in WebKit-derived browsers. It can place the reflection on a chosen side with an offset and optional mask, but it remains non-standard.
-webkit-box-shadow Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box shadow feature.
-webkit-box-sizing Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS box sizing feature.
-webkit-filter Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS filter feature.
-webkit-flex Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex feature.
-webkit-flex-basis Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex basis feature.
-webkit-flex-direction Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex direction feature.
-webkit-flex-flow Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex flow feature.
-webkit-flex-grow Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex grow feature.
-webkit-flex-shrink Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex shrink feature.
-webkit-flex-wrap Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS flex wrap feature.
-webkit-font-smoothing Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS font smoothing feature.
Is a non-standard WebKit property that influences font antialiasing on some Apple platforms. Values such as antialiased and subpixel-antialiased are widely seen in legacy design systems, but behavior is platform-specific and not standardized.
-webkit-line-clamp Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS line clamp feature.
Limits text to a specified number of lines in the long-standing WebKit clamping pattern. It is widely encountered in production code, usually together with -webkit-box-orient and a compatible display value, even as standardized line-clamping work continues.
-webkit-mask Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS mask feature.
Is the WebKit-prefixed shorthand for mask-related properties. It was widely used before unprefixed CSS masking became broadly interoperable.
-webkit-mask-box-image Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS mask box image feature.
-webkit-mask-clip Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS mask clip feature.
-webkit-mask-composite Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS mask composite feature.
-webkit-mask-image Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS mask image feature.
Is the prefixed WebKit form of mask-image. Older Safari and Chromium-era code often uses it to apply gradient or image masks.
-webkit-mask-origin Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS mask origin feature.
-webkit-mask-position Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS mask position feature.
-webkit-mask-position-x Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS mask position x feature.
-webkit-mask-position-y Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS mask position y feature.
-webkit-mask-repeat Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS mask repeat feature.
-webkit-mask-repeat-x Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS mask repeat x feature.
-webkit-mask-repeat-y Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS mask repeat y feature.
-webkit-mask-size Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS mask size feature.
-webkit-overflow-scrolling Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS overflow scrolling feature.
-webkit-perspective Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS perspective feature.
-webkit-perspective-origin Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS perspective origin feature.
-webkit-tap-highlight-color Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS tap highlight color feature.
Controls the highlight color shown when a user taps a link or interactive element in WebKit-based mobile browsers. It is non-standard and mostly used to alter or suppress the default tap flash.
-webkit-text-fill-color Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS text fill color feature.
Sets the fill color of text in WebKit-derived implementations. It is commonly seen in gradient-text techniques where the text fill is made transparent so a clipped background can show through.
-webkit-text-security Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS text security feature.
Masks text using disc, circle, or square glyphs in WebKit-derived browsers. It is a non-standard visual masking feature sometimes used to imitate password-style obscuring outside native password inputs.
-webkit-text-size-adjust Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS text size adjust feature.
Is the WebKit-prefixed form of text-size-adjust and controls automatic text inflation on mobile browsers. It is common in older responsive stylesheets targeting Safari and mobile WebKit.
-webkit-text-stroke Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS text stroke feature.
Adds an outline stroke around text glyphs in WebKit-derived implementations. It is shorthand for stroke width and stroke color and is commonly used for display typography rather than ordinary body text.
-webkit-text-stroke-color Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS text stroke color feature.
-webkit-text-stroke-width Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS text stroke width feature.
-webkit-touch-callout Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS touch callout feature.
-webkit-transform Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS transform feature.
-webkit-transform-origin Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS transform origin feature.
-webkit-transform-style Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS transform style feature.
-webkit-transition Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS transition feature.
-webkit-transition-delay Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS transition delay feature.
-webkit-transition-duration Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS transition duration feature.
-webkit-transition-property Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS transition property feature.
-webkit-transition-timing-function Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS transition timing function feature.
-webkit-user-select Vendor Extension
Browser-prefixed historical or non-standard variant related to the CSS user select feature.
accent-color Ui
Sets the accent color used by compatible form controls and UI widgets.
Sets the accent color used by certain form controls and other user-interface elements. It can affect controls such as checkboxes, radio buttons, range sliders, and progress indicators while still leaving the browser in charge of their overall native appearance.
align-content Alignment
Aligns and distributes content tracks or flex lines within a container.
Controls how extra space is distributed between rows or tracks inside a flex or grid container when there is room left over in the cross axis. It matters when the container has multiple lines or tracks and a definite size larger than the content needs.
align-items Alignment
Sets the default cross-axis alignment for items in an alignment container.
Sets the default cross-axis alignment for items inside a flex or grid container. Individual items can override the container's choice with align-self.
align-self Alignment
Overrides the cross-axis alignment of an individual item.
Overrides the container's align-items value for one flex or grid item. It is useful when a single item needs different cross-axis alignment from its siblings.
alignment-baseline Alignment
Specifies which baseline of an inline-level box aligns with its parent.
Controls which baseline of an inline-level or SVG element is aligned with the corresponding baseline of its parent. It is mainly useful in advanced typography and SVG text where alphabetic, central, mathematical, or other baselines need explicit alignment.
all Cascade
Resets almost all CSS properties on an element to a selected cascade-wide value.
Resets nearly every CSS property on an element at once using a global keyword such as initial, inherit, unset, revert, or revert-layer. It is useful when a component needs to deliberately discard most styling inherited from or applied by surrounding rules.
anchor-name Positioning
Defines one or more names that identify an element as an anchor for CSS anchor positioning.
Assigns one or more anchor names to an element for CSS anchor positioning. Other positioned elements can reference those anchors to place themselves relative to the anchor's geometry.
anchor-scope Positioning
Limits the scope in which CSS anchor names can be resolved.
Controls the scope in which named anchors can be resolved for anchor positioning. It helps prevent anchor names in one component from unintentionally matching anchors elsewhere.
animation Animation
Shorthand for defining CSS keyframe animations.
Is the shorthand for the main CSS animation settings, including name, duration, timing function, delay, iteration count, direction, fill mode, play state, and timeline-related behavior. Multiple animations can be assigned by separating animation definitions with commas.
animation-composition Animation
Controls the composition component of CSS animations.
Controls how an animation's effect combines with the element's underlying value or with other animations targeting the same property. It can replace, add to, or accumulate with existing values where the property supports those operations.
animation-delay Animation
Controls the delay component of CSS animations.
Sets how long the browser waits before an animation begins. Negative delays are allowed and make the animation start as though it had already been running for part of its duration.
animation-direction Animation
Controls the direction component of CSS animations.
Controls whether an animation runs forward, backward, or alternates direction between cycles. It changes how keyframes are traversed without changing the keyframes themselves.
animation-duration Animation
Controls the duration component of CSS animations.
Sets the length of one animation cycle. A duration of zero means the animation has no visible running time even if the rest of its animation properties are defined.
animation-fill-mode Animation
Controls the fill mode component of CSS animations.
Controls which keyframe styles apply before an animation starts and after it ends. Values such as forwards and backwards let an animated element retain or pre-apply keyframe states outside the active animation interval.
animation-iteration-count Animation
Controls the iteration count component of CSS animations.
Sets how many times an animation repeats. It accepts a number or infinite, and fractional values can represent a partial final cycle.
animation-name Animation
Controls the name component of CSS animations.
Identifies the @keyframes rule or rules used by an animation. If the name does not match a defined keyframes block, no keyframe animation runs for that entry.
animation-play-state Animation
Controls the play state component of CSS animations.
Pauses or runs an animation without removing its definition. Pausing preserves the current progress so the animation can continue from the same point later.
animation-range Animation
Controls the range component of CSS animations.
Defines the portion of a scroll- or view-driven animation timeline during which the animation is active. It is shorthand for animation-range-start and animation-range-end.
animation-range-end Animation
Controls the range end component of CSS animations.
Sets the point on a scroll- or view-driven animation timeline where an animation's active range ends. Together with animation-range-start, it can confine an animation to only part of a scroll or view timeline.
animation-range-start Animation
Controls the range start component of CSS animations.
Sets the point on a scroll- or view-driven animation timeline where an animation's active range begins. It can use named timeline ranges and offsets so the animation starts when a tracked element reaches a particular stage of its scroll progress.
animation-timeline Animation
Controls the timeline component of CSS animations.
Chooses the timeline that drives a CSS animation. In addition to the normal document time timeline, animations can be tied to scrolling or an element's progress through a viewport.
animation-timing-function Animation
Controls the timing function component of CSS animations.
Controls how animation progress is distributed over time within each cycle. Common values include ease, linear, step functions, and custom cubic-bezier curves.
appearance Ui
Controls whether a UI element uses native platform styling.
Controls whether certain elements use platform-native styling or a more CSS-controlled appearance. It is especially common with form controls where authors want to reduce browser-specific native presentation.
aspect-ratio Sizing
Sets a preferred width-to-height aspect ratio for a box.
Sets a preferred width-to-height ratio for an element. It can influence automatic sizing and is especially useful for media, cards, responsive boxes, and other components that should preserve a predictable shape.
azimuth Speech
Historical aural CSS property setting the horizontal direction of a sound source.
Was part of the old aural CSS model and described the horizontal direction from which synthesized speech should appear to come. It belonged to an experimental speech-rendering system that never became part of ordinary web styling.
backdrop-filter Effects
Applies graphical filter effects to content behind an element.
Applies graphical effects to the content visible behind an element rather than to the element itself. Effects such as blur, brightness, contrast, or saturation are most noticeable when the element has some transparency.
backface-visibility Transform
Controls whether the back face of a transformed element is visible.
Controls whether the reverse side of an element is visible when a 3D transform turns it away from the viewer. Hiding the back face is common in card-flip and other 3D interface effects.
background Background
Controls the background aspect of CSS layout, styling, or rendering.
Is the shorthand for an element's background color, images, positioning, sizing, repetition, attachment, origin, and clipping. It can define multiple layered background images, with the background color painted beneath them.
background-attachment Background
Controls the attachment component of an element background.
Controls whether a background image scrolls with the element, remains fixed relative to the viewport, or behaves relative to a scrolling element's contents. fixed backgrounds can create a stationary-image effect behind moving page content.
background-blend-mode Background
Controls the blend mode component of an element background.
Sets how an element's background images blend with each other and with its background color. It uses blend modes such as multiply, screen, overlay, and difference.
background-clip Background
Controls the clip component of an element background.
Controls how far an element's background is painted, such as beneath the border, only inside the padding box, or only behind the content. Some implementations also support clipping a background to text for text-filled image effects.
background-color Background
Controls the color component of an element background.
Sets the color painted behind an element's content and background images. Transparent is the initial value, so the background of underlying content can show through unless another color is assigned.
background-image Background
Controls the image component of an element background.
Sets one or more images, gradients, or other image-producing values as an element's background. Multiple background layers are painted in the order they are listed, with the first layer on top.
background-origin Background
Controls the origin component of an element background.
Sets the box from which a background image's positioning area is calculated. It can use the border box, padding box, or content box as the reference rectangle.
background-position Background
Controls the position component of an element background.
Sets the starting position of a background image within its positioning area. Positions can be expressed with keywords, lengths, percentages, or combinations of horizontal and vertical offsets.
background-position-x Background
Controls the position x component of an element background.
Sets the horizontal component of background image positioning. It is useful when the horizontal position needs to be changed independently from the vertical position.
background-position-y Background
Controls the position y component of an element background.
Sets the vertical component of background image positioning. It separates that axis from background-position when independent control is convenient.
background-repeat Background
Controls the repeat component of an element background.
Controls whether and how background images repeat when they do not fill the painting area. It can repeat along both axes, one axis, or not at all, and also supports spacing-oriented repeat modes.
background-repeat-x Background
Controls the repeat x component of an element background.
Controls repetition of background images along the horizontal axis. It is a longhand form of the horizontal portion of background-repeat.
background-repeat-y Background
Controls the repeat y component of an element background.
Controls repetition of background images along the vertical axis. It is useful when vertical tiling behavior needs to be addressed independently.
background-size Background
Controls the size component of an element background.
Controls the rendered size of background images. cover fills the available area while preserving aspect ratio and cropping as needed, while contain fits the entire image inside the area without cropping.
baseline-shift Alignment
Shifts an inline box relative to its dominant baseline.
Moves an inline-level or SVG text box relative to its dominant baseline. It is especially associated with SVG text and can produce subscript- or superscript-like baseline changes without changing the font itself.
baseline-source Alignment
Controls which box edge or baseline source is used when synthesizing a baseline.
Specifies which baseline set should be used to align an inline-level box. It matters mainly in specialized baseline alignment situations involving inline blocks, tables, and other boxes with more than one plausible baseline source.
behavior Ui
Non-standard Internet Explorer property attaching an HTC behavior component to an element.
block-size Sizing
Controls the block size aspect of CSS layout, styling, or rendering.
Sets an element's size in the block direction rather than assuming that direction is always vertical. In ordinary horizontal writing it corresponds roughly to height, but it adapts to writing mode.
border Border
Controls the border aspect of CSS layout, styling, or rendering.
Is the shorthand for border width, style, and color on all four physical sides. Because the style defaults to none, setting only a width or color without a visible style does not produce a drawn border.
border-block Border
Sets one or more properties for the block border.
Sets the borders on the block-start and block-end sides using logical rather than physical directions. It adapts automatically when writing mode changes.
border-block-color Border
Sets the color of the block border.
Sets the border colors on an element's logical block sides. In horizontal writing these usually correspond to top and bottom, but the mapping changes with writing mode.
border-block-end Border
Sets one or more properties for the block end border.
Sets width, style, and color for the logical block-end border. In a typical left-to-right horizontal document this is usually the bottom border.
border-block-end-color Border
Sets the color of the block end border.
Sets the color of the border on the logical block-end side. In ordinary horizontal writing this is usually the bottom border, but the physical side changes with writing mode.
border-block-end-style Border
Sets the line style of the block end border.
Sets the line style of the logical block-end border. It supports the same kinds of styles as physical borders, including solid, dashed, dotted, double, and none.
border-block-end-width Border
Sets the width of the block end border.
Sets the thickness of the logical block-end border. It is the writing-mode-aware counterpart to border-bottom-width in ordinary horizontal text.
border-block-start Border
Sets one or more properties for the block start border.
Sets width, style, and color for the logical block-start border. In a typical horizontal document this is usually the top border.
border-block-start-color Border
Sets the color of the block start border.
Sets the color of the logical block-start border. In common horizontal writing this generally maps to the top border.
border-block-start-style Border
Sets the line style of the block start border.
Sets the line style of the logical block-start border. The physical side it affects depends on writing mode.
border-block-start-width Border
Sets the width of the block start border.
Sets the thickness of the logical block-start border. It allows border sizing to follow document flow direction instead of a fixed top edge.
border-block-style Border
Sets the line style of the block border.
border-block-width Border
Sets the width of the block border.
border-bottom Border
Sets one or more properties for the bottom border.
Sets the width, style, and color of the element's bottom border. It is the physical-side shorthand for border-bottom-width, border-bottom-style, and border-bottom-color.
border-bottom-color Border
Sets the color of the bottom border.
Sets the color of the bottom border. A visible border style must also be present for the color to appear.
border-bottom-left-radius Border
Sets the corner radius for the bottom left corner.
Rounds the element's bottom-left corner. It can use one radius or separate horizontal and vertical radii to create elliptical corners.
border-bottom-right-radius Border
Sets the corner radius for the bottom right corner.
Rounds the element's bottom-right corner. Larger values create more pronounced curves, up to pill-like and circular shapes when combined with the other corners.
border-bottom-style Border
Sets the line style of the bottom border.
Sets the line style of the bottom border, such as solid, dashed, dotted, double, or none. Border width and color can be set separately.
border-bottom-width Border
Sets the width of the bottom border.
Sets the thickness of the bottom border. The border remains invisible if its style is none or hidden.
border-collapse Border
Sets one or more properties for the collapse border.
Controls whether adjacent table cell borders are separated or merged into a shared collapsed border model. It applies to table layout and changes how border conflicts and spacing are resolved.
border-color Border
Sets the color of the border.
Sets border colors for all four sides, using the same one-to-four-value pattern as margin and padding. Each side's border style still determines whether that color is actually drawn.
border-end-end-radius Border
Sets the corner radius for the end end corner.
Rounds the corner where the logical block-end and inline-end sides meet. Which physical corner that means depends on writing mode and text direction.
border-end-start-radius Border
Sets the corner radius for the end start corner.
Rounds the corner where the logical block-end and inline-start sides meet. It provides direction-aware corner rounding for components that may be mirrored or vertically written.
border-image Border
Sets one or more properties for the image border.
Uses an image as the source for an element's border decoration. It is a shorthand for source, slice, width, outset, and repeat behavior, allowing one image to be cut and stretched or tiled around the border box.
border-image-outset Border
Controls the outset component of border images.
Controls how far a border image extends beyond the border box. Positive outset values can make the decorative border paint outside the element without changing its layout dimensions.
border-image-repeat Border
Controls the repeat component of border images.
Controls how the middle portions of a sliced border image are stretched, repeated, rounded, or spaced along each side. Horizontal and vertical behavior can be set separately.
border-image-slice Border
Controls the slice component of border images.
Defines how the source image for a border image is divided into regions. Those slices are then mapped to the element's corners and sides, with the optional fill keyword also painting the center.
border-image-source Border
Controls the source component of border images.
Specifies the image used to draw an element's border image. The source can be a URL or an image-producing value such as a gradient.
border-image-width Border
Sets the width of the image border.
Sets the width of the area used to draw the border image. It can differ from the element's ordinary border-width, allowing the decorative image to occupy a larger or smaller area.
border-inline Border
Sets one or more properties for the inline border.
Sets borders on the logical inline-start and inline-end sides. In left-to-right horizontal writing these correspond roughly to the left and right borders.
border-inline-color Border
Sets the color of the inline border.
Sets border colors on both logical inline sides. In left-to-right horizontal writing these correspond to the left and right borders.
border-inline-end Border
Sets one or more properties for the inline end border.
Sets width, style, and color for the logical inline-end border. Its physical side depends on the writing direction and writing mode.
border-inline-end-color Border
Sets the color of the inline end border.
Sets the color of the logical inline-end border. Its physical side follows writing direction rather than being permanently tied to right or left.
border-inline-end-style Border
Sets the line style of the inline end border.
Sets the line style of the logical inline-end border. It is useful for components that need to mirror automatically in right-to-left layouts.
border-inline-end-width Border
Sets the width of the inline end border.
Sets the thickness of the logical inline-end border. The affected physical side depends on writing mode and direction.
border-inline-start Border
Sets one or more properties for the inline start border.
Sets width, style, and color for the logical inline-start border. In left-to-right horizontal writing this is normally the left border.
border-inline-start-color Border
Sets the color of the inline start border.
Sets the color of the logical inline-start border. In ordinary left-to-right horizontal text this is usually the left border.
border-inline-start-style Border
Sets the line style of the inline start border.
Sets the line style of the logical inline-start border. It follows the start side of inline text rather than a fixed physical edge.
border-inline-start-width Border
Sets the width of the inline start border.
Sets the thickness of the logical inline-start border. It is the direction-aware counterpart to a physical left or right border width.
border-inline-style Border
Sets the line style of the inline border.
Sets the border styles on both logical inline sides. One or two values can give the start and end borders the same or different styles.
border-inline-width Border
Sets the width of the inline border.
Sets the widths of the logical inline-start and inline-end borders. It adapts to text direction and writing mode.
border-left Border
Sets one or more properties for the left border.
Sets width, style, and color for the left border in one declaration. Logical alternatives such as border-inline-start are often preferable when a layout must adapt to different writing directions.
border-left-color Border
Sets the color of the left border.
Sets the color of the element's physical left border. A visible border style is still required for the color to appear.
border-left-style Border
Sets the line style of the left border.
Sets the line style of the physical left border. Logical border-inline-start or border-inline-end may be preferable for direction-aware components.
border-left-width Border
Sets the width of the left border.
Sets the thickness of the physical left border. The border remains invisible when its style is none or hidden.
border-radius Border
Sets the corner radius for the radius corner.
Rounds one or more corners of an element's border box. It can define uniform circles, elliptical radii, or different values for each corner.
border-right Border
Sets one or more properties for the right border.
Sets width, style, and color for the right border. It is a physical-direction property and does not automatically mirror for right-to-left writing.
border-right-color Border
Sets the color of the right border.
Sets the color of the physical right border. It can inherit currentColor when no separate border color is specified.
border-right-style Border
Sets the line style of the right border.
Sets the line style of the physical right border. It accepts the standard border styles such as solid, dotted, dashed, double, and none.
border-right-width Border
Sets the width of the right border.
Sets the thickness of the physical right border. Logical border width properties are often better for layouts that need to mirror.
border-spacing Border
Sets one or more properties for the spacing border.
Sets the horizontal and vertical space between table cells when the table uses the separated border model. It has no effect when border-collapse is collapse.
border-start-end-radius Border
Sets the corner radius for the start end corner.
Rounds the corner where the logical block-start and inline-end sides meet. The actual physical corner changes with writing mode and direction.
border-start-start-radius Border
Sets the corner radius for the start start corner.
Rounds the corner where the logical block-start and inline-start sides meet. It is useful for direction-independent components such as callouts, tabs, and message bubbles.
border-style Border
Sets the line style of the border.
Sets the line style for all four borders. It accepts one to four values so different sides can use different styles.
border-top Border
Sets one or more properties for the top border.
Sets width, style, and color for the top border. It is the physical-side shorthand for the three corresponding top-border longhands.
border-top-color Border
Sets the color of the top border.
Sets the color of the physical top border. If the top border style is none, changing its color alone has no visible effect.
border-top-left-radius Border
Sets the corner radius for the top left corner.
Rounds the physical top-left corner of an element. One value creates a circular radius, while two values create an elliptical corner.
border-top-right-radius Border
Sets the corner radius for the top right corner.
Rounds the physical top-right corner. It is one of the four longhand corner-radius properties covered by border-radius.
border-top-style Border
Sets the line style of the top border.
Sets the line style of the physical top border. Width and color can be controlled independently.
border-top-width Border
Sets the width of the top border.
Sets the thickness of the physical top border. Named widths such as thin, medium, and thick are also accepted.
border-width Border
Sets the width of the border.
Sets the thickness of all four borders, using one to four values. A width by itself does not make a border visible if the border style remains none.
bottom Positioning
Sets the physical bottom inset of a positioned element.
Sets the offset between a positioned element and the bottom edge of its containing block. Its effect depends on the element's position scheme and can interact with top and the element's own size.
box-align Other
Controls the box align aspect of CSS layout, styling, or rendering.
Belongs to the older CSS box layout model and controls alignment of child boxes along the cross axis. It is chiefly encountered in legacy code that predates the modern flexbox alignment properties.
box-decoration-break Border
Controls how box decorations are rendered when an element is fragmented.
Controls how borders, backgrounds, padding, and similar box decorations behave when an element is fragmented across lines, columns, or pages. clone repeats the decoration on each fragment, while slice treats the fragments as pieces of one continuous box.
box-direction Other
Controls the box direction aspect of CSS layout, styling, or rendering.
Controls the direction in which children are laid out in the old CSS box model. Modern flexbox uses flex-direction and writing-direction-aware layout instead.
box-flex Other
Controls the box flex aspect of CSS layout, styling, or rendering.
Sets the flexibility of an item in the obsolete early box layout model. It is a historical precursor to the modern flex-grow, flex-shrink, and flex-basis system.
box-flex-group Other
Controls the box flex group aspect of CSS layout, styling, or rendering.
Was part of the old box layout model and assigned flex items to numbered flexibility groups. It did not survive into modern flexbox.
box-lines Other
Controls the box lines aspect of CSS layout, styling, or rendering.
Was intended to control whether children in the old box layout model could wrap onto multiple lines. The old model was replaced before this property became a durable part of normal CSS authoring.
box-ordinal-group Other
Controls the box ordinal group aspect of CSS layout, styling, or rendering.
Controls visual ordering in the old CSS box model through numeric groups. Modern flex and grid layouts use order instead.
box-orient Other
Controls the box orient aspect of CSS layout, styling, or rendering.
Sets horizontal or vertical orientation in the obsolete early box model. It is the unprefixed historical counterpart to vendor-prefixed properties such as -webkit-box-orient.
box-pack Other
Controls the box pack aspect of CSS layout, styling, or rendering.
Controls distribution of children along the main axis in the old CSS box model. justify-content replaced this role in modern flexbox.
box-shadow Border
Adds one or more shadow effects around an element’s box.
Draws one or more shadows around an element's box. Each shadow can specify horizontal and vertical offsets, blur, spread, color, and whether it is an inset shadow.
box-sizing Sizing
Controls whether specified width and height include padding and border.
Controls what is included in the declared width and height of an element. border-box includes padding and borders inside the stated dimensions, while content-box applies the dimensions only to the content box.
break-after Fragmentation Paged Media
Controls fragmentation breaks after a generated box.
Controls whether a page, column, or region break should occur after an element. It is used in fragmented layouts such as printing and multi-column content.
break-before Fragmentation Paged Media
Controls fragmentation breaks before a generated box.
Controls whether a page, column, or other fragmentation break should occur before an element. It is the modern counterpart to older page-break-before behavior.
break-inside Fragmentation Paged Media
Controls fragmentation breaks inside a generated box.
Controls whether a box may be broken across pages, columns, or other fragmentation contexts. avoid is commonly used to keep a figure, card, or short section together when printing or flowing into columns.
caption-side Table
Positions a table caption relative to its table.
Controls where a table caption is placed relative to the table box. top and bottom are the most familiar values.
caret Ui
Controls the caret aspect of CSS layout, styling, or rendering.
Is a shorthand for caret-color, caret-shape, and caret-animation where those longhands are supported. It lets text-caret appearance and behavior be configured in one declaration.
caret-animation Ui
Controls the animation aspect of the text insertion caret.
Controls whether the text insertion caret uses its normal blinking animation. It can be useful in interfaces where a blinking caret is undesirable or interferes with a custom editing presentation.
caret-color Ui
Controls the color aspect of the text insertion caret.
Sets the color of the text insertion caret in editable elements. auto usually lets the browser choose a color that remains visible against the current background.
caret-shape Ui
Controls the shape aspect of the text insertion caret.
Requests a shape for the text insertion caret, such as a bar, block, or underscore. It is useful for terminal-like or editor interfaces when the browser supports the requested form.
clear Display Overflow
Controls whether an element must move below preceding floating elements.
Controls whether an element must move below preceding floated elements. It can clear floats on the left, right, both sides, or logical inline directions.
clip Masking Clipping
Legacy property that clips an absolutely positioned element to a rectangular region.
Historically clipped an absolutely positioned element to a rectangular region using rect() syntax. Modern code generally uses clip-path, which supports more flexible shapes and does not carry the same legacy positioning restrictions.
clip-path Masking Clipping
Clips an element to a basic shape, SVG path, or referenced clipping path.
Clips an element to a geometric shape, SVG path, or referenced clipping source. Portions of the element outside the clipping region are not painted, which makes the property useful for masks, cutouts, and nonrectangular shapes.
clip-rule Masking Clipping
Controls the clip rule aspect of CSS layout, styling, or rendering.
color Text
Sets the foreground color used for text and related decorations.
Sets the foreground text color and also supplies the currentColor value used by many other properties. Because it inherits, a color set on a container usually becomes the default text color for its descendants.
color-interpolation Svg
Controls the color interpolation aspect of CSS layout, styling, or rendering.
Controls which color space is used for certain color interpolation operations, especially in SVG. It can affect gradients, filters, and other operations where intermediate colors must be calculated.
color-interpolation-filters Svg
Controls the color interpolation filters aspect of CSS layout, styling, or rendering.
Controls the color space used when SVG filter effects interpolate color values. The choice can noticeably change the appearance of blended or filtered colors.
color-scheme Color Adjustment
Indicates which color schemes an element can render in.
Tells the browser which color schemes an element can comfortably participate in, such as light or dark. It can affect browser-provided UI including form controls, scrollbars, and default colors.
column-count Columns
Controls the count aspect of multi-column layout.
Requests a particular number of columns in a multi-column layout. The browser balances content among those columns subject to the available width and other column settings.
column-fill Columns
Controls the fill aspect of multi-column layout.
Controls how content is distributed among columns in a multi-column container. balance tries to make columns similar in height, while auto fills columns sequentially when the container has a constrained block size.
column-gap Alignment
Sets the gap between columns in supported layout systems.
Sets the space between columns in multi-column layout and can also act as the column gap in grid and flex layouts. It is one of the longhands covered by gap.
column-height Columns
Controls the height aspect of multi-column layout.
column-rule Columns
Controls the rule aspect of multi-column layout.
Draws a line between columns in a multi-column layout. It is a shorthand for rule width, style, and color and does not itself change the gap between columns.
column-rule-color Columns
Controls the color component of the rule between columns.
Sets the color of the rule drawn between columns in a multi-column layout. The rule needs a visible style and width before its color can be seen.
column-rule-style Columns
Controls the style component of the rule between columns.
Sets the line style of the rule between columns in multi-column layout. It supports the usual border-style keywords.
column-rule-width Columns
Controls the width component of the rule between columns.
Sets the thickness of the rule drawn between columns. It does not change the size of the column gap itself.
column-span Columns
Controls the span aspect of multi-column layout.
Allows an element inside multi-column content to span across all columns instead of remaining within one column. Headings are a common use case.
column-width Columns
Controls the width aspect of multi-column layout.
Sets an ideal column width for multi-column layout. The browser can adjust the actual number and width of columns to fit the available space.
column-wrap Columns
Controls the wrap aspect of multi-column layout.
columns Columns
Controls the columns aspect of CSS layout, styling, or rendering.
Is the shorthand for column-width and column-count. It lets an author describe the desired width, number of columns, or both in one declaration.
contain Containment
Applies layout, paint, size, style, or inline-size containment to an element.
Declares that an element's layout, style, paint, size, or inline-size effects are sufficiently isolated from the rest of the page. This can reduce the amount of work the browser must redo when that subtree changes.
contain-intrinsic-block-size Sizing
Sets a placeholder intrinsic block size used with size containment.
Provides a fallback intrinsic size in the logical block direction for content whose normal rendering may be skipped. It can keep layout stable when content-visibility or size containment prevents the browser from measuring the real content immediately.
contain-intrinsic-height Sizing
Sets a placeholder intrinsic height used with size containment.
Provides a fallback intrinsic physical height for contained or skipped content. It helps reserve an approximate amount of vertical space before the element is fully rendered.
contain-intrinsic-inline-size Sizing
Sets a placeholder intrinsic inline size used with size containment.
Provides a fallback intrinsic size in the logical inline direction. It is the writing-mode-aware counterpart to contain-intrinsic-width.
contain-intrinsic-size Sizing
Sets a placeholder intrinsic size used with size containment.
Provides a fallback intrinsic size for content whose real size may be skipped because of containment or content-visibility. It helps reserve stable layout space before the browser fully renders that content.
contain-intrinsic-width Sizing
Sets a placeholder intrinsic width used with size containment.
Provides a fallback intrinsic physical width for contained content. It can prevent sudden reflow when skipped content later becomes rendered.
container Containment
Shorthand for assigning a container name and query containment type.
Is the shorthand for container-name and container-type. It can name an element for container queries and declare what kind of queryable size containment it provides in one declaration.
container-name Containment
Assigns one or more names to a query container.
Assigns one or more names to an element that can be targeted by container queries. Naming lets a descendant query a specific ancestor container instead of relying only on the nearest eligible one.
container-type Containment
Establishes an element as a size or inline-size query container.
Declares what kind of containment an element provides for container queries. Values such as inline-size make the element queryable based on its inline dimension.
content Generated Content
Specifies generated content and replacement content in supported contexts.
Generates or replaces content in specific CSS-generated-content contexts, especially pseudo-elements such as ::before and ::after. It can insert strings, counters, quotation marks, images, and other generated values.
content-visibility Containment
Allows the browser to skip rendering work for off-screen or otherwise unneeded content.
Lets the browser skip rendering work for content that is currently outside the relevant viewport or otherwise not needed. auto can significantly reduce rendering cost on long pages while preserving layout with intrinsic-size hints.
corner-block-end-shape Border
Controls the shape of the block end corner or corner group.
corner-block-start-shape Border
Controls the shape of the block start corner or corner group.
corner-bottom-left-shape Border
Controls the shape of the bottom left corner or corner group.
corner-bottom-right-shape Border
Controls the shape of the bottom right corner or corner group.
corner-bottom-shape Border
Controls the shape of the bottom corner or corner group.
corner-end-end-shape Border
Controls the shape of the end end corner or corner group.
corner-end-start-shape Border
Controls the shape of the end start corner or corner group.
corner-inline-end-shape Border
Controls the shape of the inline end corner or corner group.
corner-inline-start-shape Border
Controls the shape of the inline start corner or corner group.
corner-left-shape Border
Controls the shape of the left corner or corner group.
corner-right-shape Border
Controls the shape of the right corner or corner group.
corner-shape Border
Controls the shape used to render element corners.
corner-start-end-shape Border
Controls the shape of the start end corner or corner group.
corner-start-start-shape Border
Controls the shape of the start start corner or corner group.
corner-top-left-shape Border
Controls the shape of the top left corner or corner group.
corner-top-right-shape Border
Controls the shape of the top right corner or corner group.
corner-top-shape Border
Controls the shape of the top corner or corner group.
counter-increment List Counter
Increments one or more CSS counters.
Increases or decreases one or more CSS counters. It is used with counter-reset, counter-set, and generated content to create custom numbering systems.
counter-reset List Counter
Creates or resets one or more CSS counters.
Creates or resets one or more CSS counters to specified values. Descendants can then increment and display those counters.
counter-set List Counter
Sets existing CSS counters to specified values.
Sets one or more CSS counters to explicit values without first resetting their scope. It differs from counter-reset by changing an existing counter when possible and creating one only when necessary.
cue Speech
Historical aural CSS shorthand for sounds played before and after spoken content.
Was the shorthand for cue-before and cue-after in the CSS speech model. It allowed audio cues to play around spoken content, but speech CSS has remained highly specialized.
cue-after Speech
Historical aural CSS property specifying a sound played after spoken content.
Was intended to play an auditory cue after an element's spoken rendering. It belongs to the old CSS speech and aural styling model.
cue-before Speech
Historical aural CSS property specifying a sound played before spoken content.
Was intended to play an auditory cue before an element's spoken rendering. It is another rarely implemented part of CSS speech.
cursor Ui
Specifies the mouse or pointing-device cursor shown over an element.
Sets the pointer cursor shown when the pointing device is over an element. It supports named cursor shapes and can also reference custom cursor images with fallbacks.
cx Svg
CSS presentation property corresponding to the SVG cx geometry attribute.
Sets the x-coordinate of the center point for SVG circles and ellipses. It can be styled or animated as a CSS geometry property in supporting browsers.
cy Svg
CSS presentation property corresponding to the SVG cy geometry attribute.
Sets the y-coordinate of the center point for SVG circles and ellipses. It works with radius properties to determine the shape's geometry.
d Svg
CSS presentation property corresponding to the SVG d geometry attribute.
Sets SVG path data from CSS for elements that use a path definition. It allows the geometry of an SVG path to be controlled or animated through CSS rather than only through the element's d attribute.
direction Writing Mode
Sets the base direction of text and table-column flow.
Sets the base direction for text and some layout behavior, usually ltr or rtl. For document language direction, the HTML dir attribute is generally the primary semantic mechanism, with CSS direction used when presentation needs require it.
display Display Overflow
Controls an element’s display type and the layout behavior of its generated boxes.
Controls the type of box an element generates and how that box participates in layout. Values cover block and inline flow, flexbox, grid, tables, list items, contents behavior, and removal from layout with none.
dominant-baseline Svg
Specifies the dominant baseline used for text alignment.
Controls which baseline is used as the dominant alignment reference for text, especially in SVG and vertical typography. Values can select alphabetic, central, mathematical, hanging, and other baseline systems.
dynamic-range-limit Color Adjustment
Controls the dynamic range limit aspect of CSS layout, styling, or rendering.
elevation Speech
Historical aural CSS property setting the vertical direction of a sound source.
Was part of aural CSS and described the apparent vertical angle of a spoken voice in a 3D audio space. It is effectively a historical speech-rendering property.
empty-cells Table
Controls whether borders and backgrounds are drawn around empty table cells.
Controls whether borders and backgrounds are drawn around empty table cells in the separated border model. It does not apply when borders are collapsed.
field-sizing Sizing
Controls whether a form control sizes itself from its content.
Controls whether certain form controls use a fixed default size or size themselves based on their content. content sizing can make inputs and textareas grow or shrink more naturally around what they contain.
fill Svg
Sets the primary SVG/CSS fill paint.
Sets the paint used inside SVG shapes and text. It can be a solid color, gradient or pattern reference, context paint, or none.
fill-opacity Svg
Controls the opacity component of SVG/CSS fill painting.
Sets the opacity of an SVG element's fill paint independently from its stroke or overall element opacity. A value of 0 makes the fill transparent without removing the fill definition itself.
fill-rule Svg
Controls the rule component of SVG/CSS fill painting.
Controls how the interior of a self-intersecting SVG shape is determined. The nonzero and evenodd rules can produce different filled regions from the same path geometry.
filter Effects
Applies graphical filter effects such as blur, contrast, or color adjustment.
Applies graphical effects to the rendered element and its descendants as a composited result. Common functions include blur, brightness, contrast, grayscale, hue-rotate, invert, opacity, saturate, sepia, and drop-shadow.
flex Flexbox
Shorthand for flex grow, shrink, and basis values.
Is the shorthand for flex-grow, flex-shrink, and flex-basis on a flex item. Common patterns such as flex: 1 allow items to share available space while still respecting flexbox sizing rules.
flex-basis Flexbox
Controls the basis behavior of a flex item or flex container.
Sets the initial main-axis size used for a flex item before free space is distributed. It can be a length, percentage, content-based value, or auto.
flex-direction Flexbox
Controls the direction behavior of a flex item or flex container.
Sets the main-axis direction of a flex container. row, row-reverse, column, and column-reverse determine both the axis and the order in which flex items are laid out.
flex-flow Flexbox
Controls the flow behavior of a flex item or flex container.
Is the shorthand for flex-direction and flex-wrap. It describes the direction of the flex main axis and whether items are allowed to wrap onto additional lines.
flex-grow Flexbox
Controls the grow behavior of a flex item or flex container.
Sets how strongly a flex item grows relative to its siblings when positive free space is available. A value of 0 prevents growth, while larger ratios claim proportionally more extra space.
flex-shrink Flexbox
Controls the shrink behavior of a flex item or flex container.
Sets how strongly a flex item is allowed to shrink when the flex container is too small. Shrinking is weighted by both this factor and the item's flex base size.
flex-wrap Flexbox
Controls the wrap behavior of a flex item or flex container.
Controls whether flex items stay on one line or wrap onto multiple lines when there is not enough room. wrap-reverse also reverses the cross-axis stacking direction of wrapped lines.
float Display Overflow
Places an element to one side of its container and allows inline content to wrap around it.
Moves an element to one side of its container and allows surrounding inline content to wrap around it. Although once used for entire page layouts, floats are now mainly useful for text-wrapping cases such as images embedded in prose.
flood-color Svg
Controls the color used by SVG flood filter primitives.
Sets the color used by the SVG feFlood filter primitive. That generated solid-color image can then be combined with other filter inputs.
flood-opacity Svg
Controls the opacity used by SVG flood filter primitives.
Sets the opacity of the color produced by an SVG feFlood filter primitive. It affects the flood image before later filter operations combine it with other content.
font Font
Shorthand for setting multiple font properties in one declaration.
Is a shorthand for several core font properties, including style, variant, weight, stretch, size, line height, and family. Because it resets omitted font subproperties to defaults, it can have broader effects than a series of isolated font declarations.
font-family Font
Specifies a prioritized list of font families.
Sets the preferred typeface or list of fallback typefaces for text. Authors normally finish the list with a generic family such as serif, sans-serif, monospace, cursive, or system-ui.
font-feature-settings Font
Provides low-level control over OpenType font features.
Provides low-level control over OpenType font features using feature tags. It is useful when a specific typographic feature is unavailable through higher-level properties, but more semantic font-variant properties are usually preferable where they exist.
font-kerning Font
Controls use of font kerning information.
Controls whether font kerning information is used to adjust spacing between particular pairs of glyphs. auto and normal generally allow appropriate kerning, while none disables it.
font-language-override Font
Controls the language override aspect of font selection or rendering.
Overrides the language system used for OpenType glyph substitution and positioning. It is a low-level typographic control for fonts whose language-specific forms need to be selected independently from the document's declared language.
font-optical-sizing Font
Controls optical-size variation in variable fonts that support it.
Controls whether a variable font with an optical-size axis automatically adjusts its design for the rendered text size. Optical sizing can change stroke detail, spacing, and proportions rather than simply scaling the same outlines.
font-palette Font
Selects a palette for color fonts.
Selects a color palette for color fonts that provide multiple palette choices. It can use built-in palettes or custom palettes defined with @font-palette-values.
font-size Font
Sets the size of glyphs used for text.
Sets the size of text glyphs. It can use absolute lengths, relative units, percentages, keywords, and calculated values, and it is inherited by descendants unless overridden.
font-size-adjust Font
Preserves perceived text size across fallback fonts by adjusting based on font metrics.
Adjusts fallback font sizing based on a font metric so text remains visually comparable when the preferred typeface is unavailable. It can reduce abrupt changes in apparent text size between fallback fonts.
font-smooth Font
Non-standard property controlling font anti-aliasing or smoothing behavior.
Is a non-standard typography control found in some browser engines for adjusting font antialiasing behavior. It is implementation-specific and can produce different results across platforms, so it should not be treated as portable CSS.
font-stretch Font
Selects a normal, condensed, or expanded font face.
Selects a condensed or expanded face from a font family when such widths are available. With variable fonts it can map to the font's width axis rather than choosing a separate static file.
font-style Font
Selects normal, italic, or oblique font faces.
Selects normal, italic, or oblique text styling. Italic usually requests a dedicated italic face, while oblique can use a slanted form and may accept an angle range when the font supports it.
font-synthesis Font
Controls the synthesis aspect of font selection or rendering.
Controls whether the browser may synthesize missing typographic forms such as bold, italic, small caps, or position variants when the font does not provide them. Disabling synthesis can preserve typeface fidelity at the cost of losing those visual distinctions.
font-synthesis-position Font
Controls synthetic position generation when the font lacks the requested face.
Controls whether the browser may synthesize subscript and superscript positioning when the font lacks designed positional glyphs. It complements other font-synthesis controls for weight, style, and small caps.
font-synthesis-small-caps Font
Controls synthetic small caps generation when the font lacks the requested face.
font-synthesis-style Font
Controls synthetic style generation when the font lacks the requested face.
font-synthesis-weight Font
Controls synthetic weight generation when the font lacks the requested face.
font-variant Font
Shorthand for multiple typographic font-variant features.
Is a shorthand for a collection of typographic variant controls covering ligatures, caps, numeric forms, East Asian forms, alternates, and position. It is useful when a font supports richer OpenType features than ordinary bold and italic styling.
font-variant-alternates Font
Controls the alternates OpenType typographic variants.
Controls alternate glyph forms provided by OpenType fonts, including stylistic alternates and named feature sets. It is intended for deliberate typographic choices rather than ordinary fallback styling.
font-variant-caps Font
Controls the caps OpenType typographic variants.
Selects capital-letter variants such as small caps, all-small-caps, petite caps, or unicase when the font provides them. It asks the font for designed glyph variants rather than merely shrinking ordinary uppercase letters.
font-variant-east-asian Font
Controls the east asian OpenType typographic variants.
Controls East Asian glyph variants, width forms, and ruby-related typographic features. It can request regional forms such as jis78 or jis90 and width variants such as full-width or proportional-width where the font supports them.
font-variant-emoji Font
Controls the emoji OpenType typographic variants.
Controls whether characters with both text and emoji presentations should prefer normal text, emoji-style rendering, or a Unicode-defined presentation. The actual result still depends on available fonts and platform support.
font-variant-ligatures Font
Controls the ligatures OpenType typographic variants.
Controls standard, discretionary, historical, and contextual ligatures and related contextual forms. It gives higher-level access to common OpenType ligature behavior without requiring raw feature tags.
font-variant-numeric Font
Controls the numeric OpenType typographic variants.
Controls typographic forms for numbers, including lining versus oldstyle figures, proportional versus tabular widths, slashed zero, ordinals, and fractions. It is especially useful in tables, prices, clocks, and other number-heavy interfaces.
font-variant-position Font
Controls the position OpenType typographic variants.
Requests designed superscript or subscript glyphs from a font when available. This can preserve stroke weight and proportions better than geometrically shrinking ordinary glyphs.
font-variation-settings Font
Provides low-level control over axes in variable fonts.
Provides direct low-level control over axes in a variable font using four-letter axis tags and numeric values. Higher-level properties such as font-weight, font-stretch, and font-style should usually be used for standard axes when possible.
font-weight Font
Sets the weight or boldness of the font.
Sets the thickness or weight of text, from lighter to heavier faces. It supports named values such as normal and bold as well as numeric weights, and variable fonts can provide a continuous range instead of fixed steps.
font-width Font
Sets the desired width class of a font face.
Provides a width-selection control related to font stretch in newer typography specifications. It expresses condensed-to-expanded font selection in a more direct width-oriented form where supported.
forced-color-adjust Color Adjustment
Controls whether forced-colors mode may alter an element’s colors.
Controls whether an element's colors are automatically adjusted in forced-colors modes such as Windows High Contrast. none asks the browser to preserve the author's colors, so it should be used only when doing so will remain legible.
gap Alignment
Sets gaps between rows and columns in multi-column, flex, and grid layouts.
Sets spacing between rows and columns in grid, flex, and multi-column layouts without adding outer spacing around the container. It is shorthand for row-gap and column-gap.
grid Grid
Shorthand for defining grid templates and auto-placement behavior.
Is a broad shorthand for defining explicit grid rows and columns and some forms of implicit grid behavior. Because it resets several grid-related properties, it is powerful but can be harder to read than narrower grid shorthands.
grid-area Grid
Controls the area aspect of CSS Grid layout.
Assigns a grid item to a named area or specifies its row and column start and end lines. It can be used with grid-template-areas for readable layout names or with explicit line positions.
grid-auto-columns Grid
Controls the auto columns aspect of CSS Grid layout.
Sets the size of implicitly created grid columns. These columns appear when grid items are placed outside the explicit column structure or when automatic placement needs additional tracks.
grid-auto-flow Grid
Controls the auto flow aspect of CSS Grid layout.
Controls how the grid auto-placement algorithm fills available cells. It can place items primarily by rows or columns, and dense packing can attempt to fill earlier gaps with later items.
grid-auto-rows Grid
Controls the auto rows aspect of CSS Grid layout.
Sets the size of implicitly created grid rows. It is used when automatic placement or explicit item positioning creates rows outside the grid defined by grid-template-rows.
grid-column Grid
Controls the column aspect of CSS Grid layout.
Is the shorthand for a grid item's column start and end positions. It can refer to numbered lines, named lines, spans, or automatic placement.
grid-column-end Grid
Controls the column end aspect of CSS Grid layout.
Sets the grid line where a grid item ends in the column axis. It can also use span syntax to say how many tracks the item should cover.
grid-column-start Grid
Controls the column start aspect of CSS Grid layout.
Sets the grid line where a grid item begins in the column axis. Named grid lines can make complex layouts easier to understand than raw line numbers.
grid-row Grid
Controls the row aspect of CSS Grid layout.
Is the shorthand for a grid item's row start and end positions. It can place the item by line numbers, names, or spans.
grid-row-end Grid
Controls the row end aspect of CSS Grid layout.
Sets the ending grid line for an item in the row axis. span values can define the item's size in tracks without naming the final line directly.
grid-row-start Grid
Controls the row start aspect of CSS Grid layout.
Sets the starting grid line for an item in the row axis. It participates in explicit placement while unspecified axes can still be handled by auto-placement.
grid-template Grid
Controls the template aspect of CSS Grid layout.
Is the shorthand for explicit grid rows, columns, and named areas. It can describe an entire grid structure in a compact declaration but does not define implicit track sizing.
grid-template-areas Grid
Controls the template areas aspect of CSS Grid layout.
Defines named rectangular regions of a grid using quoted row strings. Grid items can then occupy those regions by assigning the corresponding name through grid-area.
grid-template-columns Grid
Controls the template columns aspect of CSS Grid layout.
Defines the explicit column tracks of a grid and their sizes. It supports fixed and flexible lengths, percentages, minmax(), repeat(), named lines, and intrinsic sizing keywords.
grid-template-rows Grid
Controls the template rows aspect of CSS Grid layout.
Defines the explicit row tracks of a grid and their sizes. Like columns, rows can use fixed, flexible, intrinsic, repeated, and minmax-based track definitions.
hanging-punctuation Text
Controls whether punctuation may hang outside the line box.
Controls whether selected punctuation marks may hang outside the line box at the beginning or end of a line. This can improve the visual edge alignment of carefully typeset paragraphs.
height Sizing
Sets the preferred height of an element.
Sets the preferred height of an element's box in the physical vertical direction. Its exact effect depends on box sizing, min/max constraints, containing-block calculations, and whether the element's height is otherwise automatic.
hyphenate-character Text
Controls the hyphenate character aspect of CSS layout, styling, or rendering.
Sets the character or string shown where automatic or manual hyphenation breaks a word. auto lets the browser choose an appropriate hyphenation mark for the language and font.
hyphenate-limit-chars Text
Controls the hyphenate limit chars aspect of CSS layout, styling, or rendering.
Sets minimum character counts used when deciding whether a word may be automatically hyphenated. It can restrict hyphenation based on total word length and the number of characters that must remain before and after the break.
hyphens Text
Controls whether words may be automatically hyphenated at line breaks.
Controls whether words may be hyphenated when text wraps. auto can use language-aware hyphenation when the browser has an appropriate dictionary and the document language is known.
image-orientation Images
Controls the orientation applied to replaced image content.
Controls how an image is oriented when rendered, including whether metadata such as EXIF orientation should be honored. Modern browsers normally interpret image orientation metadata automatically.
image-rendering Images
Provides a hint about the image scaling algorithm used by the browser.
Provides a hint about how images should be scaled when their rendered size differs from their intrinsic size. Values such as pixelated or crisp-edges can preserve hard pixel boundaries for low-resolution artwork.
image-resolution Images
Specifies resolution handling for raster images.
ime-mode Ui
Legacy browser-specific property controlling Input Method Editor activation behavior.
Controlled the state of an Input Method Editor in some older browsers. It was mainly used for East Asian text entry and is obsolete in modern web authoring.
initial-letter Other
Controls size and sink depth for dropped or raised initial letters.
Creates an enlarged initial letter that occupies multiple lines, as in traditional drop caps. It can specify both the letter's size in line units and how far it sinks into the surrounding text.
inline-size Sizing
Controls the inline size aspect of CSS layout, styling, or rendering.
Sets an element's size in the inline direction. In ordinary horizontal writing it behaves roughly like width, but it adapts automatically to vertical writing modes.
inset Positioning
Controls the inset aspect of CSS layout, styling, or rendering.
Is the shorthand for top, right, bottom, and left offsets on positioned elements. It uses the same one-to-four-value pattern as margin and padding.
inset-block Positioning
Sets the block logical inset of a positioned element.
Sets offsets on the logical block-start and block-end sides of a positioned element. It adapts to the current writing mode instead of assuming top and bottom.
inset-block-end Positioning
Sets the block end logical inset of a positioned element.
Sets the offset of a positioned element from the logical block-end edge of its containing block. In normal horizontal writing this usually corresponds to bottom.
inset-block-start Positioning
Sets the block start logical inset of a positioned element.
Sets the offset of a positioned element from the logical block-start edge. It is the writing-mode-aware counterpart to top in common horizontal layouts.
inset-inline Positioning
Sets the inline logical inset of a positioned element.
Sets offsets on the logical inline-start and inline-end sides of a positioned element. In ordinary left-to-right horizontal text these usually correspond to left and right.
inset-inline-end Positioning
Sets the inline end logical inset of a positioned element.
Sets a positioned element's offset from the logical inline-end edge. In left-to-right horizontal text this normally corresponds to right.
inset-inline-start Positioning
Sets the inline start logical inset of a positioned element.
Sets a positioned element's offset from the logical inline-start edge. In left-to-right horizontal text this normally corresponds to left.
interactivity Ui
Controls the interactivity aspect of CSS layout, styling, or rendering.
interest-delay Ui
Controls the interest delay aspect of CSS layout, styling, or rendering.
interest-delay-end Ui
Controls the interest delay end aspect of CSS layout, styling, or rendering.
interest-delay-start Ui
Controls the interest delay start aspect of CSS layout, styling, or rendering.
interpolate-size Sizing
Controls whether intrinsic sizing keywords can interpolate in animations.
Controls whether intrinsic sizing keywords such as auto can participate in certain size interpolations and transitions. It makes it possible to animate between explicit lengths and some intrinsic sizes where browsers support the feature.
isolation Effects
Controls whether an element establishes a new stacking context for blending.
Controls whether an element creates a new stacking context for blending purposes. isolate is useful when mix-blend-mode effects should be contained rather than blending with content outside the element's group.
justify-content Alignment
Aligns and distributes content along the main or inline axis.
Controls how free space is distributed along the main axis of a flex container or the relevant alignment axis of a grid or other alignment context. Common values include start, center, end, space-between, space-around, and space-evenly.
justify-items Alignment
Sets default inline-axis alignment for items in an alignment container.
Sets the default inline-axis alignment of items within their grid areas or other supported alignment contexts. Individual items can override it with justify-self.
justify-self Alignment
Overrides inline-axis alignment for an individual item.
Overrides justify-items for one item. It is commonly used in grid layout when a single item needs different inline-axis alignment from the rest.
left Positioning
Sets the physical left inset of a positioned element.
Sets the offset between a positioned element and the left edge of its containing block. Logical inset-inline-start is often a better choice for layouts that need to adapt to right-to-left or vertical writing.
letter-spacing Text
Sets additional spacing between characters.
Adds or removes space between characters in text. Small positive or negative adjustments are common in typography, though extreme values can make text harder to read.
lighting-color Svg
Controls the lighting color aspect of CSS layout, styling, or rendering.
Sets the light color used by SVG diffuse and specular lighting filter primitives. Changing it alters the color cast of the simulated light rather than the underlying painted object.
line-break Other
Controls line-breaking rules, especially for East Asian text.
Controls how strictly line-breaking rules are applied, especially for East Asian text. Values can loosen or tighten where breaks are permitted around punctuation and particular character classes.
line-clamp Other
Limits content to a specified number of lines.
Limits block content to a specified number of lines and typically clips or truncates the remainder. It is commonly used for multi-line excerpts and cards where text length must be visually constrained.
line-height Text
Sets the height of line boxes.
Sets the height of text line boxes and therefore the vertical spacing between lines of text. Unitless values are often useful because descendants inherit the multiplier rather than a computed absolute length.
line-height-step Text
Controls the line height step aspect of CSS layout, styling, or rendering.
list-style List Counter
Controls the list style aspect of CSS layout, styling, or rendering.
Is the shorthand for list marker type, position, and image. It is commonly applied to ul or ol elements and inherited by their list items.
list-style-image List Counter
Controls the image component of list markers.
Uses an image as the marker for list items. More flexible custom marker styling is often possible through the ::marker pseudo-element.
list-style-position List Counter
Controls the position component of list markers.
Controls whether a list marker is positioned outside the principal content box or inside it as part of the text flow. inside markers affect wrapping and indentation differently from the default outside placement.
list-style-type List Counter
Controls the type component of list markers.
Sets the marker style used for list items, such as discs, decimal numbers, Roman numerals, alphabetic sequences, or none. Custom counter styles can extend the available numbering systems.
margin Box Model
Controls the margin aspect of CSS layout, styling, or rendering.
Sets the outer space around an element's border box. It accepts one to four values for the physical sides, and auto margins have special layout behavior in block, flex, and grid contexts.
margin-block Box Model
Sets the block margin of an element.
Sets margins on the logical block-start and block-end sides. In horizontal writing these usually correspond to top and bottom margins.
margin-block-end Box Model
Sets the block end margin of an element.
Sets the margin on the logical block-end side. In ordinary horizontal writing this usually maps to margin-bottom.
margin-block-start Box Model
Sets the block start margin of an element.
Sets the margin on the logical block-start side. It follows writing mode rather than being permanently tied to the physical top edge.
margin-bottom Box Model
Sets the bottom margin of an element.
Sets the physical bottom margin of an element. In normal block flow, vertical margins can participate in margin collapsing under specific conditions.
margin-inline Box Model
Sets the inline margin of an element.
Sets margins on the logical inline-start and inline-end sides. It is especially useful for direction-aware layouts that should work in both left-to-right and right-to-left text.
margin-inline-end Box Model
Sets the inline end margin of an element.
Sets the margin on the logical inline-end side. In left-to-right horizontal writing this is usually the right margin.
margin-inline-start Box Model
Sets the inline start margin of an element.
Sets the margin on the logical inline-start side. It is useful for indentation and component spacing that should mirror automatically in right-to-left text.
margin-left Box Model
Sets the left margin of an element.
Sets the physical left margin of an element. In flex and some other layout contexts, auto values can absorb free space and are often used for alignment.
margin-right Box Model
Sets the right margin of an element.
Sets the physical right margin of an element. Logical margin-inline-end can be preferable when the interface must adapt to different text directions.
margin-top Box Model
Sets the top margin of an element.
Sets the physical top margin of an element. Adjacent vertical margins in normal block flow may collapse rather than simply adding together.
margin-trim Box Model
Sets the trim margin of an element.
Controls whether selected margins of a container's children are trimmed at the container edges. It is intended to make component spacing easier by removing otherwise redundant outer margins.
marker Svg
Controls the marker aspect of CSS layout, styling, or rendering.
Is an SVG shorthand for assigning marker graphics to the start, middle vertices, and end of a path. Arrowheads and repeated path symbols are common marker uses.
marker-end Svg
Controls the end SVG marker used on a shape.
Sets the SVG marker drawn at the final vertex of a path or shape. It is commonly used for arrowheads at the end of lines.
marker-mid Svg
Controls the mid SVG marker used on a shape.
Sets an SVG marker drawn at intermediate vertices along a path. It can place repeated symbols or directional marks at each interior point.
marker-offset Svg
Historical CSS property controlling the offset between list content and its marker.
Was an older list-marker positioning property intended to control the distance between a marker and the principal box. Modern list styling uses marker-related pseudo-elements, padding, and layout instead.
marker-start Svg
Controls the start SVG marker used on a shape.
Sets the SVG marker drawn at the first vertex of a path. A start marker can differ from the marker used at the opposite end.
mask Masking Clipping
Controls the mask aspect of CSS layout, styling, or rendering.
Uses one or more images or gradients to control which portions of an element are visible. Unlike clipping, masks can use varying alpha or luminance values to create soft or partially transparent edges.
mask-border Masking Clipping
Controls the border component of CSS masking.
Uses an image to mask the border region of an element. It resembles border-image conceptually, but the image controls transparency rather than painting visible border artwork directly.
mask-border-mode Masking Clipping
Controls the mode component of a mask border.
Controls whether a mask-border source is interpreted using alpha values or luminance. The choice determines how source pixels are converted into mask transparency.
mask-border-outset Masking Clipping
Controls the outset component of a mask border.
Controls how far a mask border extends beyond the element's border box. It can enlarge the area affected by the mask without changing layout.
mask-border-repeat Masking Clipping
Controls the repeat component of a mask border.
Controls how the middle sections of a sliced mask-border image are stretched or repeated around the sides. It follows a model similar to border-image-repeat.
mask-border-slice Masking Clipping
Controls the slice component of a mask border.
Defines how a mask-border source image is sliced into corner and edge regions. Those regions are then mapped around the element's border area.
mask-border-source Masking Clipping
Controls the source component of a mask border.
Specifies the image used as the source for a mask border. The source image controls transparency around the border region.
mask-border-width Masking Clipping
Controls the width component of a mask border.
Sets the width of the mask-border regions around the element. It can be independent of the element's visible border width.
mask-clip Masking Clipping
Controls the clip component of CSS masking.
Controls the box to which each mask layer is clipped. It can limit mask painting to areas such as the border box, padding box, or content box.
mask-composite Masking Clipping
Controls the composite component of CSS masking.
Controls how multiple mask layers are combined with one another. Operations can add, subtract, intersect, or exclude mask regions.
mask-image Masking Clipping
Controls the image component of CSS masking.
Specifies one or more images or gradients used as masks. The mask determines which parts of the element are visible and how transparent those parts are.
mask-mode Masking Clipping
Controls the mode component of CSS masking.
Controls whether a mask source is interpreted according to its alpha channel, luminance, or the source's matching-mask rules. Different modes can turn the same source image into very different masks.
mask-origin Masking Clipping
Controls the origin component of CSS masking.
Sets the reference box used to position a mask layer. It parallels background-origin but applies to masks.
mask-position Masking Clipping
Controls the position component of CSS masking.
Sets the position of mask images within their positioning area. It uses positioning syntax similar to background-position.
mask-repeat Masking Clipping
Controls the repeat component of CSS masking.
Controls whether and how mask images repeat across the masked element. Horizontal and vertical repetition can be specified independently.
mask-size Masking Clipping
Controls the size component of CSS masking.
Sets the rendered size of mask images. Values such as cover and contain behave similarly to their background-size counterparts.
mask-type Masking Clipping
Controls the type component of CSS masking.
Controls whether an SVG mask element is interpreted by alpha or luminance. It applies to the mask source itself rather than the element being masked.
math-depth Math
Controls the depth aspect of mathematical layout.
Controls the depth level used when sizing nested mathematical notation. It helps MathML and math-oriented CSS reduce script and subsuperscript sizes consistently.
math-shift Math
Controls the shift aspect of mathematical layout.
Controls compact versus normal shifting behavior for mathematical scripts. It is intended for MathML presentation where superscripts and subscripts may need tighter positioning.
math-style Math
Controls the style aspect of mathematical layout.
Selects normal or compact mathematical layout. Compact style is intended for contexts such as scripts where formulas should use a tighter presentation.
max-block-size Sizing
Controls the max block size aspect of CSS layout, styling, or rendering.
Sets the maximum size of an element in the logical block direction. It corresponds roughly to max-height in horizontal writing but adapts to writing mode.
max-height Sizing
Sets the maximum height of an element.
Sets an upper limit on an element's physical height. It constrains the result of height and automatic sizing without forcing the element to be that tall.
max-inline-size Sizing
Controls the max inline size aspect of CSS layout, styling, or rendering.
Sets the maximum size of an element in the logical inline direction. It is the writing-mode-aware counterpart to max-width.
max-width Sizing
Sets the maximum width of an element.
Sets an upper limit on an element's width. It is commonly used with width: 100% to make media or containers fluid while preventing them from growing beyond a desired maximum.
min-block-size Sizing
Controls the min block size aspect of CSS layout, styling, or rendering.
Sets the minimum size of an element in the logical block direction. It adapts to writing mode rather than assuming that the block direction is vertical.
min-height Sizing
Sets the minimum height of an element.
Sets a lower bound on an element's physical height. The element may grow taller if its content or other constraints require more space.
min-inline-size Sizing
Controls the min inline size aspect of CSS layout, styling, or rendering.
Sets the minimum size of an element in the logical inline direction. It is useful when writing-mode independence matters.
min-width Sizing
Sets the minimum width of an element.
Sets a lower bound on an element's width. In flex and grid layout, automatic minimum sizes can sometimes prevent expected shrinking, making min-width: 0 an important corrective declaration.
mix-blend-mode Effects
Controls how an element’s content blends with the backdrop.
Sets how an element's rendered content blends with the backdrop behind it. It uses familiar compositing modes such as multiply, screen, overlay, and difference.
object-fit Images
Controls how replaced content is resized to fit its content box.
Controls how replaced content such as an image or video is resized inside its content box. contain preserves the whole object, while cover fills the box and crops any overflow needed to preserve aspect ratio.
object-position Images
Positions replaced content within its content box.
Sets the alignment of replaced content inside its box when object-fit leaves cropping or unused space. It works much like background-position but applies to the embedded object itself.
object-view-box Images
Defines a view box used to crop or zoom replaced content.
Defines a subregion of a replaced element's source content to use as its view box. It can crop or reframe an image-like resource before object-fit and object-position determine how that view is placed.
offset Motion Path
Controls the offset aspect of CSS layout, styling, or rendering.
Is the shorthand for motion-path properties that position and orient an element along a path. It can combine the path, distance, rotation, anchor point, and starting position in one declaration.
offset-anchor Motion Path
Controls the anchor component of motion-path positioning.
Sets the point on an element that is attached to its motion path position. Changing the anchor can make the element follow the path by its center, corner, or another point.
offset-distance Motion Path
Controls the distance component of motion-path positioning.
Sets how far an element has progressed along its motion path. Percentages make it convenient to animate an object from the beginning to the end of the path.
offset-path Motion Path
Controls the path component of motion-path positioning.
Defines the geometric path that an element follows for CSS motion-path positioning. It can use path data, basic shapes, ray functions, or other supported path sources.
offset-position Motion Path
Controls the position component of motion-path positioning.
Sets the initial position used when calculating certain motion paths. It is especially relevant to paths such as rays whose geometry depends on a starting point.
offset-rotate Motion Path
Controls the rotate component of motion-path positioning.
Controls how an element rotates while moving along a motion path. auto can align the element to the direction of travel, with an optional additional rotation angle.
opacity Effects
Sets the overall opacity of an element.
Sets the opacity of an entire element, including its descendants, as one composited result. A value below 1 also creates a stacking context, which can affect z-index behavior.
order Flexbox
Controls the visual ordering of flex and grid items.
Changes the visual order of flex or grid items within their layout container. It does not change the underlying DOM order, so using it to create a radically different reading sequence can cause accessibility and keyboard-navigation problems.
orphans Fragmentation Paged Media
Sets the minimum number of lines that must remain at the bottom of a fragmented block.
Sets the minimum number of lines from a block that should remain at the bottom of a page or column when content is fragmented. It is mainly relevant to print and other paged or columnar layouts.
outline Border
Controls the outline aspect of CSS layout, styling, or rendering.
Draws an outline around an element without taking up layout space. It is a shorthand for outline width, style, and color and is commonly used for focus indication.
outline-color Border
Controls the color component of an element outline.
Sets the color of an element's outline. The outline is only visible when a non-none outline style and usable width are present.
outline-offset Border
Controls the offset component of an element outline.
Moves an outline away from or toward the element's border edge. Positive values create a gap between the border and outline, which can make focus rings clearer.
outline-style Border
Controls the style component of an element outline.
Sets the line style used for an outline, such as solid, dotted, dashed, or auto. Browser-chosen auto outlines are often useful for preserving familiar focus indication.
outline-width Border
Controls the width component of an element outline.
Sets the thickness of an element's outline. Unlike borders, outlines do not affect the element's box dimensions.
overflow Display Overflow
Controls how content that overflows an element’s box is handled.
Controls what happens when content extends beyond an element's box. It can remain visible, be clipped, or create a scroll container, and it acts as shorthand for overflow-x and overflow-y.
overflow-anchor Display Overflow
Controls whether an element participates in scroll anchoring.
Controls whether an element participates in browser scroll anchoring. Scroll anchoring tries to keep the user's apparent reading position stable when content above the viewport changes size.
overflow-block Display Overflow
Controls the overflow block aspect of CSS layout, styling, or rendering.
Controls overflow in the logical block direction. It is the writing-mode-aware counterpart to choosing overflow-x or overflow-y based on a fixed physical axis.
overflow-clip-margin Display Overflow
Sets how far overflow may paint outside a box when overflow is clipped.
Extends the region within which content may be painted when overflow is clipped. It can preserve shadows or other visual effects just outside the normal clip edge without making the box scrollable.
overflow-inline Display Overflow
Controls the overflow inline aspect of CSS layout, styling, or rendering.
Controls overflow in the logical inline direction. Which physical axis that corresponds to depends on writing mode.
overflow-wrap Display Overflow
Allows otherwise unbreakable text to wrap to prevent overflow.
Controls whether otherwise unbreakable strings may be broken to prevent overflow. anywhere is particularly useful for long URLs, hashes, or identifiers that would otherwise force a container wider.
overflow-x Display Overflow
Controls overflow handling in the horizontal direction.
Controls overflow behavior in the horizontal axis. It can make horizontal overflow visible, clipped, hidden, automatically scrollable, or explicitly scrollable.
overflow-y Display Overflow
Controls overflow handling in the vertical direction.
Controls overflow behavior in the vertical axis. Setting one overflow axis can influence the computed behavior of the other, so x and y values are not always completely independent.
overlay Other
Controls the overlay aspect of CSS layout, styling, or rendering.
Controls whether a top-layer element's transition into or out of the top layer can participate in discrete transitions. It is mainly used with modern dialog, popover, and transition behavior.
overscroll-behavior Scrolling
Controls the overscroll behavior aspect of CSS layout, styling, or rendering.
Controls what happens when scrolling reaches the boundary of a scroll container. It can prevent scroll chaining into an ancestor and suppress some browser boundary effects.
overscroll-behavior-block Scrolling
Controls overscroll behavior along the block axis.
overscroll-behavior-inline Scrolling
Controls overscroll behavior along the inline axis.
overscroll-behavior-x Scrolling
Controls overscroll behavior along the x axis.
overscroll-behavior-y Scrolling
Controls overscroll behavior along the y axis.
padding Box Model
Controls the padding aspect of CSS layout, styling, or rendering.
Sets the inner space between an element's content and border. Unlike margins, padding is part of the element's background painting area and cannot be negative.
padding-block Box Model
Sets the block padding of an element.
Sets padding on the logical block-start and block-end sides. It adapts to writing mode rather than hard-coding top and bottom.
padding-block-end Box Model
Sets the block end padding of an element.
Sets padding on the logical block-end side. In common horizontal writing this normally corresponds to padding-bottom.
padding-block-start Box Model
Sets the block start padding of an element.
Sets padding on the logical block-start side. It follows writing mode instead of assuming a physical top edge.
padding-bottom Box Model
Sets the bottom padding of an element.
Sets the physical bottom padding inside an element. The element's background normally extends through this area.
padding-inline Box Model
Sets the inline padding of an element.
Sets padding on the logical inline-start and inline-end sides. It is useful for components intended to work naturally in different writing directions.
padding-inline-end Box Model
Sets the inline end padding of an element.
Sets padding on the logical inline-end side. In left-to-right horizontal writing this normally corresponds to padding-right.
padding-inline-start Box Model
Sets the inline start padding of an element.
Sets padding on the logical inline-start side. It is useful for controls and components that need the same conceptual leading space in both LTR and RTL layouts.
padding-left Box Model
Sets the left padding of an element.
Sets the physical left padding inside an element. Logical padding-inline-start is often a better fit for internationalized layouts.
padding-right Box Model
Sets the right padding of an element.
Sets the physical right padding inside an element. Its space sits between the content box and the right border.
padding-top Box Model
Sets the top padding of an element.
Sets the physical top padding inside an element. Unlike a top margin, it contributes to the element's own painted box rather than spacing outside it.
page Fragmentation Paged Media
Selects a named page type for paged-media layout.
Assigns an element to a named page type for paged-media layout. Named @page rules can then apply different page sizes, margins, or decorations when that element begins a page.
page-break-after Fragmentation Paged Media
Legacy property controlling page breaks after an element.
Historically controlled page breaking after an element in printed output. It has largely been superseded by break-after, which covers pages as well as other fragmentation contexts.
page-break-before Fragmentation Paged Media
Legacy property controlling page breaks before an element.
Historically controlled whether a printed page break occurred before an element. Modern stylesheets generally use break-before instead.
page-break-inside Fragmentation Paged Media
Legacy property controlling page breaks inside an element.
Historically controlled whether an element could be split across printed pages. break-inside is the modern, more general property for pages, columns, and other fragmented layout contexts.
paint-order Svg
Controls the order in which SVG fill, stroke, and markers are painted.
Controls the order in which an SVG element's fill, stroke, and markers are painted. Changing the order can affect whether thick strokes cover fills or whether markers appear above other paint.
path-length Svg
CSS presentation property corresponding to the SVG path-length geometry attribute.
pause Speech
Historical aural CSS shorthand controlling pauses before and after spoken content.
Was the shorthand for pause-before and pause-after in CSS speech. It controlled silent pauses around spoken content.
pause-after Speech
Historical aural CSS property controlling the pause after spoken content.
Was intended to insert a pause after an element when rendered by a speech synthesizer. It belongs to CSS speech rather than visual layout.
pause-before Speech
Historical aural CSS property controlling the pause before spoken content.
Was intended to insert a pause before spoken rendering of an element. It is another specialized speech property with limited implementation.
perspective Transform
Sets perspective depth for 3D-transformed descendants.
Sets the distance between the viewer and the z=0 plane for transformed descendants, creating depth in a 3D scene. Smaller values produce stronger perspective distortion.
perspective-origin Transform
Sets the vanishing-point origin for perspective.
Sets the point from which a 3D scene created with perspective appears to be viewed. Moving the origin changes the apparent vanishing point of transformed descendants.
pitch Speech
Historical aural CSS property setting the average pitch of synthesized speech.
Was part of CSS speech and controlled the average pitch of synthesized speech. It did not affect visual rendering.
pitch-range Speech
Historical aural CSS property controlling variation in synthesized-speech pitch.
Was intended to control the amount of pitch variation in synthesized speech. It is part of the old aural CSS feature set.
place-content Alignment
Shorthand for align-content and justify-content.
Is a shorthand for align-content and justify-content. It sets distribution and alignment of content along both axes in supported layout systems.
place-items Alignment
Shorthand for align-items and justify-items.
Is a shorthand for align-items and justify-items. It establishes default alignment for items along both axes in grid and other supported alignment contexts.
place-self Alignment
Shorthand for align-self and justify-self.
Is a shorthand for align-self and justify-self on an individual item. It allows one item to override container alignment in both axes at once.
play-during Speech
Historical aural CSS property specifying background audio played while an element is spoken.
Was an aural CSS property for playing background audio while an element's content was spoken. It belongs to a speech-rendering model that never became common on the web.
pointer-events Other
Controls whether an element can be the target of pointer events.
Controls whether an element can become the target of pointer hit testing. none lets pointer events pass through the element to whatever is underneath, while SVG supports additional more specialized values.
position Positioning
Controls the positioning scheme used for an element.
Chooses an element's positioning scheme: static, relative, absolute, fixed, or sticky. That choice determines how inset properties are interpreted and whether the element remains in normal document flow.
position-anchor Positioning
Controls the anchor aspect of anchored or fallback positioning.
Identifies the anchor that an anchor-positioned element should use by default. Once linked to an anchor, inset and positioning functions can refer to that anchor's geometry.
position-area Positioning
Controls the area aspect of anchored or fallback positioning.
Places an anchor-positioned element into a region around its anchor using a grid-like area vocabulary. It provides a higher-level way to say that a popup belongs above, below, before, after, or at a corner of its anchor.
position-try Positioning
Controls the try aspect of anchored or fallback positioning.
Is a shorthand for fallback positioning options used by CSS anchor positioning. It can tell the browser to try alternative placements when the preferred anchored position would overflow or otherwise fit poorly.
position-try-fallbacks Positioning
Controls the try fallbacks aspect of anchored or fallback positioning.
Lists alternative anchor-positioning options the browser may try when the default position does not fit. Fallbacks can use named @position-try rules or built-in position transformations.
position-try-order Positioning
Controls the try order aspect of anchored or fallback positioning.
Controls how alternative anchor positions are prioritized when more than one fallback could work. It can favor options based on available width, height, or other fit considerations.
position-visibility Positioning
Controls the visibility aspect of anchored or fallback positioning.
Controls visibility of an anchor-positioned element when its anchor or the positioned box no longer satisfies specified visibility conditions. It can help hide floating UI that has become detached from the content it belongs to.
print-color-adjust Color Adjustment
Provides a hint about preserving or economizing colors when printing.
Hints whether the browser should preserve authored colors and backgrounds when printing or may alter them to save ink or improve legibility. exact asks for closer visual fidelity, though user printing preferences can still take precedence.
quotes Text
Defines quotation-mark pairs used by generated quote content.
Sets the quotation-mark pairs used by generated open-quote and close-quote content. It can define language-appropriate nested quote styles or suppress generated quotation marks entirely.
r Svg
CSS presentation property corresponding to the SVG r geometry attribute.
Sets the radius of an SVG circle from CSS. It mirrors the circle element's geometry attribute and can be animated as a presentation property.
reading-flow Other
Controls the reading flow aspect of CSS layout, styling, or rendering.
Controls the order in which items participate in sequential focus and reading navigation within certain layout containers. It is meant to address cases where visual flex or grid ordering differs from DOM order.
reading-order Other
Controls the reading order aspect of CSS layout, styling, or rendering.
Assigns an item an explicit ordering value within a container whose reading-flow uses ordering behavior. It affects sequential reading or focus order without changing the underlying DOM tree.
resize Ui
Controls whether an element can be resized by the user.
Controls whether the user can resize an element with the browser's resize handle. It is commonly used on textarea but can apply to other elements when their overflow behavior allows resizing.
richness Speech
Historical aural CSS property controlling the richness of a synthesized voice.
Was part of old aural CSS and described the perceived richness or fullness of synthesized speech. It is a historical speech-rendering control.
right Positioning
Sets the physical right inset of a positioned element.
Sets the offset between a positioned element and the right edge of its containing block. Logical inset-inline-end is often preferable for direction-aware components.
rotate Transform
Applies an independent rotation transform.
Applies rotation as an individual transform property without requiring a full transform function list. It can be animated and combined independently with translate and scale.
row-gap Alignment
Sets the gap between rows in supported layout systems.
Sets spacing between rows in grid and flex layouts and between column boxes in some other layout contexts. Together with column-gap it is covered by the gap shorthand.
ruby-align Other
Controls align behavior for ruby annotations.
Controls how ruby annotation text is aligned relative to the base text it annotates. It can affect spacing and alignment when the annotation and base have different widths.
ruby-overhang Other
Controls overhang behavior for ruby annotations.
Controls whether ruby annotation text may extend over adjacent text when there is insufficient room directly above or beside its base. It helps browsers fit compact annotations without unnecessarily widening the base text.
ruby-position Other
Controls position behavior for ruby annotations.
Controls where ruby annotations are placed relative to their base text. Depending on writing mode, annotations may appear over, under, or inter-character.
rx Svg
CSS presentation property corresponding to the SVG rx geometry attribute.
Sets the horizontal radius of an SVG ellipse and can also participate in rounded SVG rectangle geometry. It can be controlled through CSS where SVG geometry properties are supported.
ry Svg
CSS presentation property corresponding to the SVG ry geometry attribute.
Sets the vertical radius of an SVG ellipse and can affect rounded SVG rectangles. Together with rx it determines elliptical curvature.
scale Transform
Applies an independent scaling transform.
Applies scaling as an individual transform property. It can scale one, two, or three axes and can be animated independently of rotate and translate.
scroll-behavior Scrolling
Controls whether programmatic scrolling is instant or smooth.
Controls whether programmatic or fragment-based scrolling jumps immediately or animates smoothly. It does not force all user-initiated scrolling to become animated.
scroll-initial-target Scrolling
Controls the initial target aspect of scrolling or scroll-linked behavior.
scroll-margin Scrolling
Controls the margin aspect of scrolling or scroll-linked behavior.
Sets extra spacing around an element for scroll snapping and scroll-to-target calculations. It is useful when a fixed header would otherwise cover the top of an element reached through fragment navigation.
scroll-margin-block Scrolling
Sets the block scroll snap margin for an element.
scroll-margin-block-end Scrolling
Sets the block end scroll snap margin for an element.
scroll-margin-block-start Scrolling
Sets the block start scroll snap margin for an element.
scroll-margin-bottom Scrolling
Sets the bottom scroll snap margin for an element.
scroll-margin-inline Scrolling
Sets the inline scroll snap margin for an element.
scroll-margin-inline-end Scrolling
Sets the inline end scroll snap margin for an element.
scroll-margin-inline-start Scrolling
Sets the inline start scroll snap margin for an element.
scroll-margin-left Scrolling
Sets the left scroll snap margin for an element.
scroll-margin-right Scrolling
Sets the right scroll snap margin for an element.
scroll-margin-top Scrolling
Sets the top scroll snap margin for an element.
scroll-marker-group Scrolling
Controls the marker group aspect of scrolling or scroll-linked behavior.
scroll-padding Scrolling
Controls the padding aspect of scrolling or scroll-linked behavior.
Defines inset spacing inside a scroll container for snapping and scroll positioning. It tells the browser that part of the scrollport should be treated as unavailable, such as space occupied by a sticky header.
scroll-padding-block Scrolling
Sets the block scroll snap padding for a scroll container.
scroll-padding-block-end Scrolling
Sets the block end scroll snap padding for a scroll container.
scroll-padding-block-start Scrolling
Sets the block start scroll snap padding for a scroll container.
scroll-padding-bottom Scrolling
Sets the bottom scroll snap padding for a scroll container.
scroll-padding-inline Scrolling
Sets the inline scroll snap padding for a scroll container.
scroll-padding-inline-end Scrolling
Sets the inline end scroll snap padding for a scroll container.
scroll-padding-inline-start Scrolling
Sets the inline start scroll snap padding for a scroll container.
scroll-padding-left Scrolling
Sets the left scroll snap padding for a scroll container.
scroll-padding-right Scrolling
Sets the right scroll snap padding for a scroll container.
scroll-padding-top Scrolling
Sets the top scroll snap padding for a scroll container.
scroll-snap-align Scrolling
Controls the snap align aspect of scrolling or scroll-linked behavior.
Specifies how a snap target should align within a scroll container when snapping occurs. It can define alignment in the block and inline axes.
scroll-snap-stop Scrolling
Controls the snap stop aspect of scrolling or scroll-linked behavior.
Controls whether a snap position may be skipped during fast scrolling. always can force the scroller to stop at that target instead of passing over it.
scroll-snap-type Scrolling
Controls the snap type aspect of scrolling or scroll-linked behavior.
Enables scroll snapping on a scroll container and specifies the snapping axis and strictness. mandatory requires snapping to a target when possible, while proximity snaps only when the viewport ends near one.
scroll-target-group Scrolling
Controls the target group aspect of scrolling or scroll-linked behavior.
scroll-timeline Scrolling
Controls the timeline aspect of scrolling or scroll-linked behavior.
Defines a named scroll-driven animation timeline based on a scroll container. Animations can reference that timeline so their progress tracks scrolling rather than elapsed clock time.
scroll-timeline-axis Scrolling
Controls the axis component of a scroll-driven animation timeline.
scroll-timeline-name Scrolling
Controls the name component of a scroll-driven animation timeline.
scrollbar-color Scrolling
Sets scrollbar thumb and track colors.
Sets the thumb and track colors of scrollbars in browsers that support standardized scrollbar styling. It offers less detailed control than browser-specific pseudo-elements but is more portable.
scrollbar-gutter Scrolling
Reserves space for scrollbars to reduce layout shifts.
Controls whether space is reserved for scrollbars even when they are not currently visible. stable can prevent layout shifts when content begins to overflow and a scrollbar appears.
scrollbar-width Scrolling
Sets a preferred scrollbar thickness.
Requests a standard scrollbar thickness such as auto, thin, or none. It does not provide arbitrary pixel-level scrollbar sizing.
shape-image-threshold Shapes
Controls the image threshold aspect of CSS shapes or SVG shape rendering.
Sets the alpha threshold used when an image defines a shape-outside contour. Pixels above the threshold count as part of the wrapping shape, while more transparent pixels do not.
shape-margin Shapes
Controls the margin aspect of CSS shapes or SVG shape rendering.
Adds extra space around the contour produced by shape-outside. It acts somewhat like a margin around the nonrectangular wrapping shape rather than around the element's ordinary box.
shape-outside Shapes
Controls the outside aspect of CSS shapes or SVG shape rendering.
Defines a nonrectangular wrapping shape around a floated element. Text can follow circles, polygons, inset shapes, or image alpha contours instead of wrapping around the element's rectangular margin box.
shape-rendering Shapes
Controls the rendering aspect of CSS shapes or SVG shape rendering.
Provides an SVG rendering hint for geometric shapes. Values can suggest priorities such as crisp edges, geometric precision, or faster rendering.
speak Speech
Historical aural CSS property controlling whether and how an element is spoken.
Controls whether and how content should be rendered by speech in CSS speech models. Its meaning and support have changed over time, and it should not be confused with simply hiding content visually.
speak-as Speech
Controls how text is spoken by speech synthesis, such as spelling or digits handling.
Controls how text is pronounced by a speech synthesizer, including whether characters, digits, or normal words should be spoken in a particular way. It is a specialized property from CSS Speech.
speak-header Speech
Historical aural CSS property controlling repetition of table headers in speech.
Was intended to control whether table headers were repeated in speech output. It belongs to older aural CSS rather than modern mainstream accessibility styling.
speak-numeral Speech
Historical aural CSS property controlling how numerals are spoken.
Was an older aural CSS property controlling whether numbers were spoken as individual digits or as complete numbers. Newer speech specifications use different mechanisms.
speak-punctuation Speech
Historical aural CSS property controlling whether punctuation is spoken.
Was intended to control whether punctuation marks were spoken aloud. It is part of the historical aural CSS model.
speech-rate Speech
Historical aural CSS property controlling synthesized-speech rate.
Controls the speed of synthesized speech in CSS speech-capable user agents. Values can use keywords or numeric rates depending on the implementation.
stop-color Svg
Controls the color of SVG gradient stops.
Sets the color of an SVG gradient stop. It is used on stop elements inside linear and radial gradients.
stop-opacity Svg
Controls the opacity of SVG gradient stops.
Sets the opacity of an SVG gradient stop independently from its stop color. Transparent stops can create fades without changing the color definition itself.
stress Speech
Historical aural CSS property controlling emphasis or stress in synthesized speech.
Was an aural CSS property describing the amount of emphasis or stress in synthesized speech. It is now mainly of historical interest.
stroke Svg
Sets the primary SVG/CSS stroke paint.
Sets the paint used to draw the outline of SVG shapes and text. It can be a color, gradient, pattern, context paint, or none.
stroke-dasharray Svg
Controls the dasharray component of an SVG/CSS stroke.
Defines the pattern of painted and unpainted lengths used for an SVG stroke. Repeating dash and gap values can create dotted, dashed, or custom rhythmic line patterns.
stroke-dashoffset Svg
Controls the dashoffset component of an SVG/CSS stroke.
Shifts the starting point of an SVG stroke's dash pattern along the path. Animating it is a common technique for drawing or moving dashed lines.
stroke-linecap Svg
Controls the linecap component of an SVG/CSS stroke.
Controls the shape used at the open ends of SVG strokes. butt, round, and square caps can noticeably change the apparent length and style of a line.
stroke-linejoin Svg
Controls the linejoin component of an SVG/CSS stroke.
Controls how SVG stroke segments are joined at corners. Common forms include miter, round, and bevel joins.
stroke-miterlimit Svg
Controls the miterlimit component of an SVG/CSS stroke.
Limits how far a mitered SVG stroke join may extend at sharp corners. If the miter would exceed the limit, the join falls back to a less extreme form.
stroke-opacity Svg
Controls the opacity component of an SVG/CSS stroke.
Sets the opacity of an SVG stroke independently from its fill and the element's overall opacity. It changes only the painted outline.
stroke-width Svg
Controls the width component of an SVG/CSS stroke.
Sets the thickness of an SVG stroke. Depending on the SVG coordinate system and vector-effect settings, the apparent width may or may not scale with transforms.
tab-size Text
Sets the visual width used for tab characters.
Controls the displayed width of tab characters in preformatted or otherwise whitespace-preserving text. It accepts a number of spaces or, in supported syntax, a length.
table-layout Table
Controls the algorithm used to lay out table cells, rows, and columns.
Chooses the table layout algorithm. fixed can determine column widths from the table width and early row information without examining every cell's content, often producing more predictable and faster layout.
text-align Text
Sets the inline alignment of text and inline content.
Sets the inline alignment of text and other inline-level content within a block. start and end adapt to writing direction, while left and right are physical directions.
text-align-last Text
Sets alignment of the final line of a block or line before a forced break.
Controls the alignment of the final line of a block or the line immediately before a forced break. It is mainly useful when the rest of the text is justified.
text-anchor Text
Controls the anchor aspect of text layout or rendering.
Controls horizontal alignment of SVG text relative to its positioning point. start, middle, and end are roughly analogous to aligning the text before, around, or after that point.
text-autospace Text
Controls the autospace aspect of text layout or rendering.
Controls automatic spacing between CJK characters and adjacent non-CJK letters, numbers, or punctuation. It can improve mixed-script typography without authors manually inserting spaces into the text.
text-box Text
Shorthand controlling trimming of extra block-axis spacing around text via text-box-trim and text-box-edge.
Is a shorthand for controlling trimming and edge selection around text boxes. It can remove extra font metric space at the start or end of text so typographic boxes align more tightly with visible glyphs.
text-box-edge Text
Specifies the font metric edges used when trimming extra spacing around text.
Selects which font or text edges are used when trimming a text box. It works with text-box-trim to define exactly where the retained text box should begin and end.
text-box-trim Text
Controls which block edges of a text box have extra spacing trimmed.
Controls whether extra spacing at the block-start, block-end, or both edges of a text box is trimmed. It is useful for precise vertical alignment where font ascender and descender metrics leave unwanted space.
text-combine-upright Text
Controls the combine upright aspect of text layout or rendering.
Combines a short run of characters into a single upright unit inside vertical text. It is commonly used for two-digit numbers or compact Latin text embedded in vertical East Asian typography.
text-decoration Text
Controls the decoration aspect of text layout or rendering.
Is a shorthand for text decoration line, color, style, and thickness. It is commonly used for underlines, overlines, and line-through effects.
text-decoration-color Text
Controls the color component of text decorations.
Sets the color of text decoration lines independently from the text color. This allows, for example, a differently colored underline while the glyphs keep their original color.
text-decoration-inset Text
Controls the inset component of text decorations.
text-decoration-line Text
Controls the line component of text decorations.
Chooses which decoration lines are drawn, including underline, overline, and line-through. Multiple line types can be combined.
text-decoration-skip Text
Controls the skip component of text decorations.
text-decoration-skip-ink Text
Controls the skip ink component of text decorations.
Controls whether underlines avoid crossing through glyph descenders and other ink. auto usually produces cleaner underlines around letters such as g, p, and y.
text-decoration-style Text
Controls the style component of text decorations.
Sets the visual style of text decoration lines, such as solid, double, dotted, dashed, or wavy. It affects the decoration line rather than the glyph shapes.
text-decoration-thickness Text
Controls the thickness component of text decorations.
Sets the thickness of underline, overline, or line-through decoration. auto and from-font can use browser or font-provided metrics instead of a fixed author value.
text-emphasis Text
Controls the emphasis aspect of text layout or rendering.
Is a shorthand for East Asian emphasis marks placed beside or above text. It controls the emphasis symbol and its color, while text-emphasis-position controls where the marks appear.
text-emphasis-color Text
Controls the color component of emphasis marks.
Sets the color of East Asian text emphasis marks. It is the color longhand covered by the text-emphasis shorthand.
text-emphasis-position Text
Controls the position component of emphasis marks.
Controls which side of the text receives East Asian emphasis marks. The available positions depend on horizontal or vertical writing.
text-emphasis-style Text
Controls the style component of emphasis marks.
Sets the shape or string used for East Asian text emphasis marks. Values include standard dot and circle forms as well as custom single-character marks.
text-indent Text
Sets the indentation of the first line of a block.
Sets the indentation of the first formatted line of a block. Additional keywords can modify whether indentation applies to hanging lines or each line after forced breaks.
text-justify Text
Controls the justification method used when text is justified.
Selects the justification method used when text-align requests justified text. It can influence whether spacing adjustments are made primarily between words, characters, or according to language-specific rules.
text-orientation Text
Controls the orientation aspect of text layout or rendering.
Controls the orientation of individual characters within vertical writing modes. It can keep Latin characters sideways, set them upright, or use script-sensitive mixed behavior.
text-overflow Text
Controls how clipped inline text overflow is signaled.
Controls how clipped inline text is signaled to the user. ellipsis can display an ellipsis where text is cut off, though the property depends on compatible overflow and white-space behavior.
text-rendering Text
Provides a rendering-quality hint for text.
Provides a rendering hint that can influence tradeoffs among speed, geometric precision, and typographic features. Browser support and exact behavior vary, so it should not be treated as a precise typography switch.
text-shadow Text
Adds shadow effects to text.
Draws one or more shadows behind text glyphs. Each shadow can specify horizontal and vertical offsets, blur radius, and color.
text-size-adjust Text
Controls automatic text-size inflation on some mobile browsers.
Controls automatic text inflation performed by some mobile browsers when pages are laid out for wider screens. It can allow, suppress, or scale that browser adjustment.
text-spacing-trim Text
Controls the spacing trim aspect of text layout or rendering.
Controls spacing around CJK punctuation at line boundaries and between adjacent punctuation marks. It lets browsers tighten or preserve punctuation spacing according to East Asian typographic conventions.
text-transform Text
Controls capitalization and other text case transformations.
Controls capitalization transformations such as uppercase, lowercase, and capitalize. The transformation is language-sensitive in browsers that implement the relevant casing rules.
text-underline-offset Text
Controls the offset of text underlines.
Moves an underline farther from or closer to the text's normal underline position. It is useful for improving legibility when default underlines crowd descenders or decorative typefaces.
text-underline-position Text
Controls the position of text underlines.
Controls where underline decoration is placed relative to the text. It can request positions suited to horizontal or vertical writing and may use font metrics when available.
text-wrap Text
Controls the wrap aspect of text layout or rendering.
Controls aspects of how inline text wraps and balances across lines. Newer values can request balanced headings or more polished line breaking without changing the underlying text.
text-wrap-mode Text
Controls the mode aspect of text wrapping.
Controls whether text is allowed to wrap. It separates basic wrapping permission from higher-level wrapping style choices.
text-wrap-style Text
Controls the style aspect of text wrapping.
Controls the strategy used when text wraps, including options intended for balanced headings or more aesthetically distributed lines. It complements text-wrap-mode rather than determining whether wrapping is allowed at all.
timeline-scope Scroll Animation
Controls the timeline scope aspect of CSS layout, styling, or rendering.
Extends the visibility scope of named animation timelines. It is useful when a descendant animation must reference a timeline defined in a different but related part of the tree.
top Positioning
Sets the physical top inset of a positioned element.
Sets the offset between a positioned element and the top edge of its containing block. Its result depends on the chosen position scheme and can interact with bottom and the element's size.
touch-action Ui
Controls which touch gestures the browser may handle natively.
Controls which default touch gestures the browser may perform on an element, such as panning and pinch zooming. It is important for custom touch interactions because it can prevent the browser from claiming gestures that script intends to handle.
transform Transform
Applies 2D or 3D geometric transformations to an element.
Applies one or more geometric transformations such as translate, rotate, scale, skew, and perspective to an element. Transforms affect visual rendering and coordinate systems without reflowing surrounding normal-flow layout.
transform-box Transform
Selects the reference box used by transforms and transform-origin.
Sets which reference box is used when calculating transforms and transform origins. It is particularly relevant to SVG, where the fill box, stroke box, and view box can produce different transform behavior.
transform-origin Transform
Sets the origin point around which transforms are applied.
Sets the point around which transformations such as rotation and scaling occur. The origin can be positioned with keywords, percentages, lengths, and an optional z-axis offset.
transform-style Transform
Controls whether transformed children are flattened or preserve 3D positioning.
Controls whether transformed descendants remain positioned in a shared 3D space or are flattened into the plane of the element. preserve-3d is required for many nested 3D transform effects.
transition Transition
Shorthand for defining CSS transitions.
Is the shorthand for the properties that define CSS transitions, including the changed property, duration, timing function, delay, and behavior. It lets changes between old and new computed values animate instead of appearing instantly.
transition-behavior Transition
Controls the behavior component of CSS transitions.
transition-delay Transition
Controls the delay component of CSS transitions.
Sets how long the browser waits after a property changes before its transition begins. Negative delays make the transition start partway through its timeline.
transition-duration Transition
Controls the duration component of CSS transitions.
Sets how long a transition takes from its starting value to its ending value. Different transitioned properties can have separate durations in comma-separated lists.
transition-property Transition
Controls the property component of CSS transitions.
Specifies which CSS properties should animate when their values change. all is convenient but can animate properties unintentionally, so explicit property lists are often easier to control.
transition-timing-function Transition
Controls the timing function component of CSS transitions.
Controls the rate of change over a transition's duration. It accepts easing keywords, cubic-bezier curves, and step functions.
translate Transform
Applies an independent translation transform.
Moves an element as an individual transform property without requiring transform: translate(...). It can represent translation on one, two, or three axes and combines cleanly with separate rotate and scale declarations.
unicode-bidi Writing Mode
Controls bidirectional text embedding and isolation behavior.
Controls how an element participates in the Unicode bidirectional text algorithm. It is a specialized property for direction isolation and overrides and is usually used together with direction in carefully defined text-direction cases.
user-modify Ui
Legacy non-standard property intended to control whether an element’s contents can be edited by the user.
user-select Ui
Controls whether and how text can be selected by the user.
Controls whether the user can select text or other content with ordinary selection gestures. none can be useful for drag handles or purely decorative interface text, but broadly disabling selection can make copying and accessibility harder.
vector-effect Svg
Controls whether vector effects such as non-scaling strokes modify SVG geometry rendering.
Controls how certain SVG vector effects behave under transformations. The best-known value, non-scaling-stroke, keeps a stroke's apparent width constant even when the geometry is scaled.
vertical-align Other
Controls inline-level or table-cell vertical alignment.
Controls vertical alignment of inline-level and table-cell boxes. On inline content it affects alignment relative to the line box or baseline, while table cells use it for vertical placement within the cell.
view-timeline Scroll Animation
Controls the view timeline aspect of CSS layout, styling, or rendering.
Defines a timeline based on an element's movement through a scrollport. It allows CSS animations to progress according to how far the tracked element has entered, crossed, or left the visible region.
view-timeline-axis Scroll Animation
Controls the axis component of a view progress timeline.
view-timeline-inset Scroll Animation
Controls the inset component of a view progress timeline.
view-timeline-name Scroll Animation
Controls the name component of a view progress timeline.
view-transition-class View Transition
Assigns one or more class-like identifiers used to style an element’s view-transition pseudo-elements.
Assigns one or more classes to view-transition pseudo-elements associated with an element. It provides a way to style groups of named transitions without writing separate rules for every individual transition name.
view-transition-name View Transition
Assigns a name identifying an element’s snapshot for participation in a view transition.
Assigns an element a name used by the View Transitions system to match visual states across a transition. Named elements can then animate between old and new page or DOM states as corresponding visual snapshots.
visibility Display Overflow
Controls whether an element is visible while generally preserving its layout space.
Controls whether an element is painted while generally preserving its layout space. hidden differs from display: none because the box usually remains in layout even though it is not visible.
voice-family Speech
Historical aural CSS property selecting a synthesized voice family.
Selects a preferred synthesized voice or voice family for speech rendering. It is conceptually similar to font-family, but for spoken output.
volume Speech
Historical aural CSS property controlling synthesized-speech volume.
Was part of the old aural CSS model and controlled synthesized speech volume. Newer CSS Speech work uses voice-volume instead.
white-space Text
Controls how whitespace is collapsed and how text wraps.
Controls how spaces, tabs, and line breaks in text are collapsed, preserved, and wrapped. Values such as normal, nowrap, pre, pre-wrap, and pre-line cover common combinations of whitespace preservation and line breaking.
white-space-collapse Text
Controls how sequences of whitespace are collapsed.
Controls how sequences of spaces, tabs, and segment breaks are collapsed or preserved. It separates whitespace collapsing behavior from line-wrapping behavior that older white-space values bundled together.
widows Fragmentation Paged Media
Sets the minimum number of lines that must remain at the top of a fragmented block.
Sets the minimum number of lines that should remain at the top of a new page or column after a paragraph is fragmented. It is primarily relevant to paged media and multi-column output.
width Sizing
Sets the preferred width of an element.
Sets an element's preferred physical width. The final used width can still be changed by min/max constraints, box sizing, intrinsic sizing, flex or grid rules, and the available containing-block space.
will-change Other
Hints which properties are expected to change so the browser may prepare optimizations.
Hints that a particular property or rendering aspect is likely to change soon. Browsers may use that information to prepare optimizations in advance, but excessive use can waste memory and produce worse performance.
word-break Text
Controls where line breaks may occur inside words.
Controls where line breaks may occur within words or otherwise unbroken text. It is especially relevant to scripts and content where ordinary word boundaries do not provide enough breaking opportunities.
word-spacing Text
Sets additional spacing between words.
Adds or removes space between words and other word-separator positions. It is inherited and can be combined with the font's normal spacing rather than replacing it outright.
writing-mode Writing Mode
Sets whether text flows horizontally or vertically and its block progression direction.
Sets whether text lines run horizontally or vertically and which direction blocks progress. It changes the meaning of logical properties such as inline-size, block-size, margin-inline, and border-block.
x Svg
CSS presentation property corresponding to the SVG x geometry attribute.
Sets the x-coordinate of certain SVG geometry elements through CSS. It mirrors corresponding SVG geometry attributes and can be animated where supported.
y Svg
CSS presentation property corresponding to the SVG y geometry attribute.
Sets the y-coordinate of certain SVG geometry elements through CSS. Like x, it allows some SVG geometry to be controlled from stylesheets.
z-index Positioning
Controls stacking order for positioned and other stacking-context-participating elements.
Controls the stacking level of positioned and certain layout elements within their stacking context. A larger z-index does not automatically place an element above everything on the page because stacking contexts form their own independent hierarchies.
zoom Sizing
Scales an element and its contents while affecting layout.
Scales the rendered size of an element and its contents while participating in layout differently from transform: scale(). It originated as a non-standard browser feature but has since been standardized for compatible use cases.