Info Unrecognized or uncommon at-rule

Which @-rules the validator treats as well-known, and why anything outside that set gets flagged for a manual look.

The validator recognizes @media, @supports, @keyframes, @font-face, @page, @layer, @container, and @scope as common, well-understood at-rules. Anything else — @import, @charset, @font-feature-values, a typo like @medai, or a newer/experimental at-rule — gets flagged as informational, just to prompt a manual check.

Why it matters

This isn't necessarily an error — it just means the at-rule falls outside the validator's recognized set, which could be a perfectly valid but less common rule (@import is valid CSS, just usually better replaced by a build-time bundler for performance reasons), a newer CSS feature the validator's list hasn't been updated for, or a genuine typo in the at-rule name. Worth a quick manual look to confirm which one it is.

Frequently asked questions

Is @import always a mistake?

It's valid CSS, but each @import forces an extra sequential network request before the imported stylesheet's rules apply, which can noticeably slow down page load. Most modern setups prefer bundling stylesheets at build time instead, which is why the validator calls it out for review rather than treating it as fully expected.

Why doesn't the validator recognize every valid at-rule?

CSS gains new at-rules over time, and the validator's recognized list covers the ones in common day-to-day use. A flag here doesn't mean invalid — just uncommon enough to be worth a second look, in case it's actually a typo.