Complete CSS @rule List

CSS @rule Reference

This complete CSS @rule list organizes @rules by purpose, making it easier to find rules for stylesheets, conditional rules, fonts, animations, page layout, custom features, and other CSS functionality.

Use the search box to find an @rule by name or description, or switch to the alphabetical view when you already know the @rule you are looking for. Each @rule links to its complete CSS reference page.

Search CSS @rules

Enter an @rule name or a word describing what the @rule does. The list will automatically display matching @rules.

Stylesheet

Stylesheet @rules control stylesheet encoding, external resources, namespaces, cascade layers, and scoped styles.

@charsetSpecifies the character encoding used by a stylesheet.

@importImports style rules from another stylesheet.

@layerCreates or identifies a cascade layer for controlling style precedence.

@namespaceDefines an XML namespace used by selectors in a stylesheet.

@scopeLimits style rules to a specified portion of the document tree.

Conditional

Conditional @rules apply CSS according to conditions such as media features, container characteristics, or browser support.

@containerApplies styles according to characteristics of a containment context.

@custom-mediaDefines a reusable custom media query.

@documentApplies styles according to conditions related to the document URL.

@elseProvides an alternative conditional branch when a preceding condition does not match.

@mediaApplies styles when specified media-query conditions are met.

@supportsApplies styles when the browser supports specified CSS features.

@supports-conditionDefines a support condition for conditional CSS processing.

@whenApplies a conditional branch when its specified condition matches.

Fonts & Typography

Font and typography @rules define downloadable fonts, font palettes, font features, and typographic variants.

@annotationDefines annotation forms for use with font feature values.

@character-variantDefines character variant values for a font family.

@font-faceDefines a custom font and the resources used to load it.

@font-feature-valuesDefines named values for alternative typographic features.

@font-palette-valuesDefines a custom palette for color fonts.

@historical-formsDefines historical-form feature values for a font family.

@ornamentsDefines ornament feature values for a font family.

@stylesetDefines styleset feature values for a font family.

@stylisticDefines stylistic-alternate feature values for a font family.

@swashDefines swash feature values for a font family.

Animation & Transitions

Animation and transition @rules define animation sequences and view-transition behavior.

@keyframesDefines the keyframes used by a CSS animation.

@starting-styleDefines starting styles used when an element receives its first style transition.

@view-transitionConfigures behavior for document view transitions.

Custom CSS

Custom CSS @rules define reusable properties, selectors, functions, mixins, and other author-defined CSS features.

@applyApplies a reusable collection of declarations.

@custom-selectorDefines a reusable custom selector.

@functionDefines a reusable custom CSS function.

@mixinDefines a reusable group of CSS declarations.

@propertyDefines and configures a custom CSS property.

Page & Print Layout

Page and print @rules control paged-media formatting and the margin boxes surrounding a page.

@pageDefines styles and dimensions for pages in paged media.

@bottom-centerDefines content and styles for the bottom-center page margin box.

@bottom-leftDefines content and styles for the bottom-left page margin box.

@bottom-left-cornerDefines content and styles for the bottom-left corner page margin box.

@bottom-rightDefines content and styles for the bottom-right page margin box.

@bottom-right-cornerDefines content and styles for the bottom-right corner page margin box.

@left-bottomDefines content and styles for the lower-left page margin box.

@left-middleDefines content and styles for the middle-left page margin box.

@left-topDefines content and styles for the upper-left page margin box.

@right-bottomDefines content and styles for the lower-right page margin box.

@right-middleDefines content and styles for the middle-right page margin box.

@right-topDefines content and styles for the upper-right page margin box.

@top-centerDefines content and styles for the top-center page margin box.

@top-leftDefines content and styles for the top-left page margin box.

@top-left-cornerDefines content and styles for the top-left corner page margin box.

@top-rightDefines content and styles for the top-right page margin box.

@top-right-cornerDefines content and styles for the top-right corner page margin box.

Positioning

Positioning @rules define fallback positioning options for anchor-positioned elements.

@position-tryDefines a custom position fallback for anchor-positioned elements.

Other @rules

These @rules provide additional CSS functionality represented in this reference.

@color-profileDefines or references a color profile for use with CSS colors.

@contentsDefines CSS behavior associated with contents in supported CSS proposals.

@counter-styleDefines a custom counter style for list markers and generated counters.