Learn

A stylesheet is a list of rules. A style rule has a selector and a block of declarations, each one a property, a colon, a value, and a semicolon. The last declaration in a block may omit the semicolon; this formatter puts it back.

At-rules start with @. @media, @supports, and @layer wrap other rules. @font-face and @keyframes hold their own descriptors. @charset has to be the first thing in the file, and @import has to come before any style rule.

Modern CSS also nests. Inside .card, &:hover means .card:hover. A custom property such as --brand is case-sensitive; ordinary property names are not. A hex color is #rgb, #rgba, #rrggbb, or #rrggbbaa.