@charset CSS At-Rule

The @charset at-rule is the mechanism in CSS for declaring the character encoding used within a stylesheet so that the parser can correctly interpret the sequence of bytes in the file. Its primary purpose is to make explicit how non-ASCII characters, escape sequences, and identifier names should be decoded into Unicode code points during parsing. When a stylesheet contains characters outside the ASCII range (for example in strings, font names, content values, or identifiers), an accurate encoding declaration prevents misinterpretation and corrupted text.

Because character decoding happens before the CSS parser understands tokens, the placement and presence of @charset matters: it is intended to describe the encoding of the stylesheet in which it appears, and therefore it must be placed where it can be read prior to any other meaningful content. It only affects the stylesheet file that contains it — each stylesheet needs its own declaration if necessary — and it does not function as a way to change encodings of other resources or of inline style blocks within documents (inline styles are interpreted according to the document’s encoding).

In practice, @charset is part of a broader ecosystem of encoding signals: files themselves, server-sent headers, and byte order marks all interact with how a user agent determines encoding. A mismatch between the declared and actual encoding can lead to mojibake (garbled characters), malformed CSS tokens, or selectors and strings that fail to match or render as intended. For these reasons, consistent encoding practices (for example, storing and serving stylesheets in a single, well-supported encoding) and ensuring build tools and editors preserve the declared encoding are important best practices when non-ASCII text appears in stylesheets.

@charset "charset";

• charsetIs a <string> denoting the character encoding to be used. It must be the name of a web-safe character encoding defined in the IANA-registry, and must be double-quoted, following exactly one space character, and immediately terminated with a semicolon.

The following information will show you the current browser support for the CSS at-rule @charset. Hover over a browser icon to see the version that first introduced support for this CSS at-rule.

This at-rule is supported by all modern browsers.

Desktop

Tablets & Mobile