This article needs a technical review. How you can help.


The symbols descriptor is used to specify the symbols that the specified counter system will use to construct counter representations. A symbol can be a string, image, or identifier. The symbols descriptor must be specified when the value of the system descriptor is cyclic, numeric, alphabetic, symbolic, or fixed. When the additive system is used, the additive-symbols descriptor is used to specify the symbols.

The possible values of the symbols descriptor include:

  • Strings - sequence of characters enclosed in single or double quotes. Backslash (\) can be used to escape special characters. For example, Unicode characters can be specified in the format "\24B6".
  • Images - In the format url(path-to-image.png)
  • Identifiers

Related at-rule@counter-style
Initial valueN/A
Computed valueas specified
Canonical orderorder of appearance in the formal grammar of the values


symbols: A B C D E;
symbols: "\24B6" "\24B7" "\24B8" D E;
symbols: "0" "1" "2" "4" "5" "6" "7" "8" "9";
symbols: url('first.svg') url('second.svg') url('third.svg');
symbols: indic-numbers;


Represents a <symbol> used within the counter system.

Formal syntax


<symbol> = <string> | <image> | <ident>



<ul class="list">


@counter-style symbols-example {
  system: fixed;
  symbols: A "1" "\24B7" D E;

.list {
  list-style: symbols-example;    



Specification Status Comment
CSS Counter Styles Level 3
The definition of 'symbols' in that specification.
Candidate Recommendation Initial definition

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support No support 33 (33) No support No support No support
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support No support 33 (33) No support No support No support

See also

Document Tags and Contributors

 Contributors to this page: duncanmcdonald, Sebastianz, kscarfone, jsx
 Last updated by: duncanmcdonald,