Skip to content

Main content

CSS Declaration List Tokenizer

Tokenize a restricted CSS declaration list with UTF-16 source spans and balanced strings/groups; comments and escaped property identifiers are unsupported.

Loading tool…

Description

Tokenize a restricted CSS declaration list with UTF-16 source spans and balanced strings/groups; comments and escaped property identifiers are unsupported.

CSS combines token syntax, property-specific value rules and layout/cascade processing. These are separate layers: splitting a declaration does not establish that its value is valid, and arithmetic on resolved lengths does not perform browser layout. Each tool here handles an explicit numeric representation or a stated lexical subset.

Tokenize a restricted CSS declaration list with UTF-16 source spans and balanced strings/groups; comments and escaped property identifiers are unsupported.

When to use this tool

Use this tool to tokenize a restricted CSS declaration list with UTF-16 source spans and balanced strings/groups; comments and escaped property identifiers are unsupported.

How to use the tool and how it works

  1. Enter text using the input definitions below.
  2. Run the operation. Resolve malformed-input errors before interpreting the result.
  3. Read result.declarations. Interpret signs, units, ordering and null values using the rules below.

Split the balanced comment-free list at top-level semicolons, skip empty pieces, and split each declaration at its first top-level colon. Normalize names and terminal !important flags, retaining each raw piece’s start/end UTF-16 offsets.1, 2

Input fieldMeaning and unitsAccepted input
textCSS-subset text to parse under the operation’s stated grammar.Text, at most 8,192 UTF-16 code units; the stated grammar and narrower limits also apply.
Output fieldInterpretation
resultObject containing the fields below.
result.declarationsSource-order declaration records including names, values, importance and raw piece spans.
json
{
  "input": {
    "text": "a:1;b:2"
  },
  "output": {
    "result": {
      "declarations": [
        {
          "name": "a",
          "value": "1",
          "important": false,
          "start": 0,
          "end": 3
        },
        {
          "name": "b",
          "value": "2",
          "important": false,
          "start": 4,
          "end": 7
        }
      ]
    }
  }
}

Limitations and assumptions

  • Spans include the declaration piece’s surrounding whitespace but exclude its semicolon. Escaped property names and full CSS error recovery are unsupported.
  • Lengths and times must already be resolved to consistent numeric units. Lexical helpers intentionally support smaller grammars than a full browser CSS parser; malformed supported-subset input causes an error.
  • Every declared top-level input is required and unknown fields are rejected. Ordinary strings are limited to 8,192 UTF-16 code units and lists to 128 entries, with tighter operation-specific bounds where stated. JSON text has bounded nesting and node counts.
  • Numeric outputs must be finite and within the absolute safe-integer magnitude; exact larger integers use decimal text. Source positions are zero-based UTF-16 offsets and span ends are exclusive unless a different convention is explicitly stated.

Alternative or Complementary methods

Use a full CSS parser or browser style/layout APIs when escape handling, error recovery, computed styles or the full cascade matter. These tools expose focused transformations and audits of supplied data.

References

  1. CSS Syntax Level 3 — W3C

  2. Tool behavior and example: CSS Declaration List Tokenizer — tool.io

Similar or alternative tools

  • CSS Animation List Slot Pairing

    Pair explicit animation names with cyclic duration/delay lists; no shorthand parsing, timing interpolation or special all/none expansion.

  • CSS Duplicate Property Table

    Audit declaration property duplicates with ordinary ASCII property folding and case-sensitive custom-property names; not a cascade engine.