W3cubDocs

/CSS

custom-ident

The <custom-ident> CSS data value denotes an arbitrary user-defined string used as an identifier. It is case-sensitive and in each context, several values are excluded to prevent misinterpretations.

Syntax

Its syntax is similar to the CSS identifier one, except that it is case-sensitive: a <custom-ident> is a sequence of characters where characters can be:

any alphanumeric character ('A' to 'Z', or 'a' to 'z'),
any decimal digit ('0' to '9'),
a dash ('-')
an underscore ('_'),
a escaped character (with a backslash, '\'),
or a Unicode character (in the format of a backslash followed by one to six hexadecimal digits, its Unicode code point).

The first character must not be a decimal digit nor a dash ('-') followed by a decimal digit or another dash. A <custom-ident> must not be placed between single or double quotes as it would be identical to a <string>.

Note that id1, Id1, iD1 and ID1 are all different identifiers as they are case-sensitive. In the opposite, as there are several ways to escape a character, toto\? and toto\3F are the same identifiers.

Lists of excluded values

In order to prevent ambiguity, each property using <custom-ident> also defined a specific list of forbidden values:

animation-name: Forbids the global CSS values, unset, initial, and inherit, and the value none.
counter-reset
counter-increment: Forbids the global CSS values, unset, initial, and inherit, and the value none.
@counter-style
list-style-type: Forbids the global CSS values, unset, initial, and inherit, as well as the values none, inline, and outside. Also quite a few predefined values are implemented by the different browsers: disc, circle, square, decimal, cjk-decimal, decimal-leading-zero, lower-roman, upper-roman, lower-greek, lower-alpha, lower-latin, upper-alpha, upper-latin, arabic-indic, armenian, bengali, cambodian, cjk-earthly-branch, cjk-heavenly-stem, cjk-ideographic, devanagari, ethiopic-numeric, georgian, gujarati, gurmukhi, hebrew, hiragana, hiragana-iroha, japanese-formal, japanese-informal, kannada, katakana, katakana-iroha, khmer, korean-hangul-formal, korean-hanja-formal, korean-hanja-informal, lao, lower-armenian, malayalam, mongolian, myanmar, oriya, persian, simp-chinese-formal, simp-chinese-informal, tamil, telugu, thai, tibetan, trad-chinese-formal, trad-chinese-informal, upper-armenian, disclosure-open, and disclosure-close.
grid-row-start grid-row-end grid-column-start grid-column-end: Forbids the span value.
will-change: Forbids the global CSS values, unset, initial, inherit, as well as the values will-change, auto, scroll-position, and contents.

Examples

These are valid identifiers:

nono79            A mix of alphanumeric characters and numbers
ground-level      A mix of alphanumeric characters and a dash
-test             A dash followed by alphanumeric characters
_internal         An underscore followed by alphanumeric characters
\22 toto          A Unicode character followed by a sequence of alphanumeric characters
bili\.bob         The period is correctly escaped

These are invalid identifiers:

34rem             It must not start with a decimal digit.
-12rad            It must not start with a dash followed by a decimal digit.
bili.bob          Only alphanumeric characters, _ and - need not to be escaped.
--toto            It must not start with two dashes.
'bilibob'         It isn't a <user-ident> but a <string>.
"bilibob"         It isn't a <user-ident> but a <string>.

Specifications

Specification	Status	Comment
CSS Will Change Module Level 1 The definition of '`<custom-ident>` for `will-change`' in that specification.	Working Draft	Defines which values are excluded for `will-change`.
CSS Counter Styles Level 3 The definition of '`<custom-ident>` for `list-style-type`' in that specification.	Candidate Recommendation	Uses `<custom-ident>` instead of a finite list of keywords and defines which values are excluded for `list-style-type` and `@counter-style`.
CSS Lists and Counters Module Level 3 The definition of '`<custom-ident>` for `counter-*`' in that specification.	Working Draft	Renames `<identifier>` to `<custom-ident>`. Adds its usage to the new `counter-set` property.
CSS Animations The definition of '`<custom-ident>` for `animation-name`' in that specification.	Working Draft	Defines which values are excluded for `animation-name`.
CSS Values and Units Module Level 3 The definition of '`<custom-ident>`' in that specification.	Candidate Recommendation	Renames `<identifier>` to `<custom-ident>`. Makes it a pseudo-type and requests the different usages to precise the excluded values.
CSS Level 2 (Revision 1) The definition of '`<identifier>`' in that specification.	Recommendation	Initial definition

Browser compatibility