This is the Standard reference for typography.
It follows the authored TeaCSS vocabulary at source revision
fa3709a for package version 0.7.1.
Each value list gives finite examples and named values for its prefixes. A
bracket or variable example demonstrates that open form for the same prefix;
the listed arbitrary literals are samples, not every accepted literal. Check
the Storybook token reference for more examples,
and do not infer support from a different prefix.
text-align
Interactive example. Rule type: shorthand.
Prefixes: text-align. Example: text-align:left. It emits text-align:left;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (10)
left, center, right, justify, start, end, match-parent, justify-all, [center], $align
text-align-last
Interactive example. Maturity: advanced.
Prefixes: text-align-last. Example: text-align-last:auto. It emits text-align-last:auto;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (10)
auto, start, end, left, right, center, justify, match-parent, [center], $alignLast
text-align-all
Interactive example. Maturity: advanced.
Prefixes: text-align-all. Example: text-align-all:start. It emits text-align-all:start;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (9)
start, end, left, right, center, justify, match-parent, [center], $alignAll
text-group-align
Interactive example. Maturity: experimental. Browser support: CSS Text Level 4 draft feature with limited browser support.
Prefixes: text-group-align. Example: text-group-align:none. It emits text-group-align:none;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (8)
none, start, end, left, right, center, [end], $groupAlign
text-justify
Interactive example.
Prefixes: text-justify. Example: text-justify:auto. It emits text-justify:auto;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (8)
auto, none, inter-word, inter-character, ruby, no-compress, [auto], $justify
text-indent
Interactive example.
Prefixes: text-indent. Example: text-indent:px. It emits text-indent:1px;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (9)
px, 2, 8, 16, 50%, [2em], [2em_hanging], [2em_each-line], $indent
line-height
Interactive example.
Prefixes: line-height. Example: line-height:1. It emits line-height:1;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (16)
1, normal, 1x, 2x, 3x, 4x, 5x, 6x, 7x, 8x, 9x, 1.5,
24px, 50%, [1.4], $lineHeight
initial-letter
Interactive example.
Prefixes: initial-letter. Example: initial-letter:normal. It emits initial-letter:normal;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (6)
normal, 1, 2, 3, [2_1], $initialLetter
initial-letter-align
Interactive example.
Prefixes: initial-letter-align. Example: initial-letter-align:alphabetic. It emits initial-letter-align:alphabetic;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (7)
alphabetic, ideographic, hanging, leading, border-box, [border-box_ideographic], $initialLetterAlign
initial-letter-wrap
Interactive example.
Prefixes: initial-letter-wrap. Example: initial-letter-wrap:none. It emits initial-letter-wrap:none;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (7)
none, first, all, grid, -40%, [0.1em], $initialLetterWrap
text-box-trim
Interactive example.
Prefixes: text-box-trim. Example: text-box-trim:none. It emits text-box-trim:none;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (6)
none, trim-start, trim-end, trim-both, [trim-start], $textBoxTrim
text-box-edge
Interactive example.
Prefixes: text-box-edge. Example: text-box-edge:auto. It emits text-box-edge:auto;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (6)
auto, text, ideographic, ideographic-ink, [cap_alphabetic], $textBoxEdge
text-wrap
Interactive example. Rule type: shorthand.
Prefixes: text-wrap. Example: text-wrap:wrap. It emits text-wrap:wrap;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (7)
wrap, nowrap, balance, pretty, stable, [balance], $wrap
text-wrap-mode
Interactive example. Maturity: advanced.
Prefixes: text-wrap-mode. Example: text-wrap-mode:wrap. It emits text-wrap-mode:wrap;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (4)
wrap, nowrap, [nowrap], $wrapMode
text-wrap-style
Interactive example. Maturity: advanced.
Prefixes: text-wrap-style. Example: text-wrap-style:auto. It emits text-wrap-style:auto;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (7)
auto, balance, stable, pretty, avoid-orphans, [pretty], $wrapStyle
white-space
Interactive example. Rule type: shorthand.
Prefixes: white-space. Example: white-space:normal. It emits white-space:normal;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (8)
normal, nowrap, pre, pre-line, pre-wrap, break-spaces, [pre], $whiteSpace
white-space-collapse
Interactive example. Maturity: advanced.
Prefixes: white-space-collapse. Example: white-space-collapse:collapse. It emits white-space-collapse:collapse;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (8)
collapse, discard, preserve, preserve-breaks, preserve-spaces, break-spaces, [preserve], $whiteSpaceCollapse
white-space-trim
Interactive example. Maturity: advanced.
Prefixes: white-space-trim. Example: white-space-trim:none. It emits white-space-trim:none;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (6)
none, discard-before, discard-after, discard-inner, [discard-before_discard-after], $whiteSpaceTrim
wrap-before
Interactive example.
Prefixes: wrap-before. Example: wrap-before:auto. It emits wrap-before:auto;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (8)
auto, avoid, avoid-line, avoid-flex, line, flex, [avoid-flex], $wrapBefore
wrap-after
Interactive example.
Prefixes: wrap-after. Example: wrap-after:auto. It emits wrap-after:auto;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (8)
auto, avoid, avoid-line, avoid-flex, line, flex, [avoid-flex], $wrapAfter
wrap-inside
Interactive example.
Prefixes: wrap-inside. Example: wrap-inside:auto. It emits wrap-inside:auto;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (4)
auto, avoid, [avoid], $wrapInside
line-break
Interactive example.
Prefixes: line-break. Example: line-break:auto. It emits line-break:auto;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (7)
auto, loose, normal, strict, anywhere, [strict], $lineBreak
overflow-wrap
Interactive example.
Prefixes: overflow-wrap. Example: overflow-wrap:normal. It emits overflow-wrap:normal;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (5)
normal, break-word, anywhere, [anywhere], $overflowWrap
word-break
Interactive example.
Prefixes: word-break. Example: word-break:normal. It emits word-break:normal;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (7)
normal, break-all, keep-all, auto-phrase, manual, [break-all], $wordBreak
text-color
Interactive example.
Prefixes: text-color. Example: text-color:ink-100. It emits color:var(--color-ink-100);. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (476)
ink-100, ink-150, ink-200, ink-300, ink-400, ink-500, ink-600, ink-700, ink-800, ink-850, ink-900, ink-950,
gray-100, gray-150, gray-200, gray-300, gray-400, gray-500, gray-600, gray-700, gray-800, gray-850, gray-900, gray-950,
mauve-100, mauve-150, mauve-200, mauve-300, mauve-400, mauve-500, mauve-600, mauve-700, mauve-800, mauve-850, mauve-900, mauve-950,
slate-100, slate-150, slate-200, slate-300, slate-400, slate-500, slate-600, slate-700, slate-800, slate-850, slate-900, slate-950,
sage-100, sage-150, sage-200, sage-300, sage-400, sage-500, sage-600, sage-700, sage-800, sage-850, sage-900, sage-950,
olive-100, olive-150, olive-200, olive-300, olive-400, olive-500, olive-600, olive-700, olive-800, olive-850, olive-900, olive-950,
sand-100, sand-150, sand-200, sand-300, sand-400, sand-500, sand-600, sand-700, sand-800, sand-850, sand-900, sand-950,
tomato-100, tomato-150, tomato-200, tomato-300, tomato-400, tomato-500, tomato-600, tomato-700, tomato-800, tomato-850, tomato-900, tomato-950,
red-100, red-150, red-200, red-300, red-400, red-500, red-600, red-700, red-800, red-850, red-900, red-950,
ruby-100, ruby-150, ruby-200, ruby-300, ruby-400, ruby-500, ruby-600, ruby-700, ruby-800, ruby-850, ruby-900, ruby-950,
crimson-100, crimson-150, crimson-200, crimson-300, crimson-400, crimson-500, crimson-600, crimson-700, crimson-800, crimson-850, crimson-900, crimson-950,
pink-100, pink-150, pink-200, pink-300, pink-400, pink-500, pink-600, pink-700, pink-800, pink-850, pink-900, pink-950,
plum-100, plum-150, plum-200, plum-300, plum-400, plum-500, plum-600, plum-700, plum-800, plum-850, plum-900, plum-950,
purple-100, purple-150, purple-200, purple-300, purple-400, purple-500, purple-600, purple-700, purple-800, purple-850, purple-900, purple-950,
violet-100, violet-150, violet-200, violet-300, violet-400, violet-500, violet-600, violet-700, violet-800, violet-850, violet-900, violet-950,
iris-100, iris-150, iris-200, iris-300, iris-400, iris-500, iris-600, iris-700, iris-800, iris-850, iris-900, iris-950,
indigo-100, indigo-150, indigo-200, indigo-300, indigo-400, indigo-500, indigo-600, indigo-700, indigo-800, indigo-850, indigo-900, indigo-950,
blue-100, blue-150, blue-200, blue-300, blue-400, blue-500, blue-600, blue-700, blue-800, blue-850, blue-900, blue-950,
cyan-100, cyan-150, cyan-200, cyan-300, cyan-400, cyan-500, cyan-600, cyan-700, cyan-800, cyan-850, cyan-900, cyan-950,
teal-100, teal-150, teal-200, teal-300, teal-400, teal-500, teal-600, teal-700, teal-800, teal-850, teal-900, teal-950,
jade-100, jade-150, jade-200, jade-300, jade-400, jade-500, jade-600, jade-700, jade-800, jade-850, jade-900, jade-950,
green-100, green-150, green-200, green-300, green-400, green-500, green-600, green-700, green-800, green-850, green-900, green-950,
grass-100, grass-150, grass-200, grass-300, grass-400, grass-500, grass-600, grass-700, grass-800, grass-850, grass-900, grass-950,
brown-100, brown-150, brown-200, brown-300, brown-400, brown-500, brown-600, brown-700, brown-800, brown-850, brown-900, brown-950,
bronze-100, bronze-150, bronze-200, bronze-300, bronze-400, bronze-500, bronze-600, bronze-700, bronze-800, bronze-850, bronze-900, bronze-950,
gold-100, gold-150, gold-200, gold-300, gold-400, gold-500, gold-600, gold-700, gold-800, gold-850, gold-900, gold-950,
sky-100, sky-150, sky-200, sky-300, sky-400, sky-500, sky-600, sky-700, sky-800, sky-850, sky-900, sky-950,
mint-100, mint-150, mint-200, mint-300, mint-400, mint-500, mint-600, mint-700, mint-800, mint-850, mint-900, mint-950,
lime-100, lime-150, lime-200, lime-300, lime-400, lime-500, lime-600, lime-700, lime-800, lime-850, lime-900, lime-950,
yellow-100, yellow-150, yellow-200, yellow-300, yellow-400, yellow-500, yellow-600, yellow-700, yellow-800, yellow-850, yellow-900, yellow-950,
amber-100, amber-150, amber-200, amber-300, amber-400, amber-500, amber-600, amber-700, amber-800, amber-850, amber-900, amber-950,
orange-100, orange-150, orange-200, orange-300, orange-400, orange-500, orange-600, orange-700, orange-800, orange-850, orange-900, orange-950,
primary-100, primary-150, primary-200, primary-300, primary-400, primary-500, primary-600, primary-700, primary-800, primary-850, primary-900, primary-950,
neutral-100, neutral-150, neutral-200, neutral-300, neutral-400, neutral-500, neutral-600, neutral-700, neutral-800, neutral-850, neutral-900, neutral-950,
focused-100, focused-150, focused-200, focused-300, focused-400, focused-500, focused-600, focused-700, focused-800, focused-850, focused-900, focused-950,
success-100, success-150, success-200, success-300, success-400, success-500, success-600, success-700, success-800, success-850, success-900, success-950,
warning-100, warning-150, warning-200, warning-300, warning-400, warning-500, warning-600, warning-700, warning-800, warning-850, warning-900, warning-950,
failure-100, failure-150, failure-200, failure-300, failure-400, failure-500, failure-600, failure-700, failure-800, failure-850, failure-900, failure-950,
general-100, general-150, general-200, general-300, general-400, general-500, general-600, general-700, general-800, general-850, general-900, general-950,
transparent, current, black, white, [#abc], $color, $color|white, red-500/50
text-transform
Interactive example.
Prefixes: text-transform. Example: text-transform:none. It emits text-transform:none;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (9)
none, uppercase, lowercase, capitalize, full-width, full-size-kana, math-auto, [uppercase_full-width], $transform
text-autospace
Interactive example.
Prefixes: text-autospace. Example: text-autospace:normal. It emits text-autospace:normal;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (10)
normal, auto, no-autospace, ideograph-alpha, ideograph-numeric, punctuation, insert, replace, [ideograph-alpha_ideograph-numeric_replace], $autospace
text-spacing
Interactive example.
Prefixes: text-spacing. Example: text-spacing:none. It emits text-spacing:none;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (16)
none, auto, normal, space-all, space-first, trim-start, trim-both, trim-all, no-autospace, ideograph-alpha, ideograph-numeric, punctuation,
insert, replace, [trim-both_ideograph-alpha], $spacing
text-spacing-trim
Interactive example.
Prefixes: text-spacing-trim. Example: text-spacing-trim:space-all. It emits text-spacing-trim:space-all;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (9)
space-all, normal, space-first, trim-start, trim-both, trim-all, auto, [trim-start], $spacingTrim
letter-spacing
Interactive example.
Prefixes: letter-spacing. Example: letter-spacing:1x. It emits letter-spacing:var(--letter-spacing-1x);. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (20)
1x, 2x, 3x, 4x, 5x, 6x, 7x, 8x, 9x, tighter, tight, wide,
wider, normal, 0.1em, 2px, -0.1em, 1, [0.1em], $letterSpacing
word-spacing
Interactive example.
Prefixes: word-spacing. Example: word-spacing:1x. It emits word-spacing:var(--word-spacing-1x);. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (17)
1x, 2x, 3x, 4x, 5x, 6x, 7x, 8x, 9x, normal, 0.1em, 2px,
-0.05em, 50%, 1, [0.1em], $wordSpacing
word-space-transform
Interactive example.
Prefixes: word-space-transform. Example: word-space-transform:none. It emits word-space-transform:none;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (6)
none, space, ideographic-space, auto-phrase, [ideographic-space_auto-phrase], $wordSpaceTransform
tab-size
Interactive example.
Prefixes: tab-size. Example: tab-size:0. It emits tab-size:0;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (9)
0, 1, 2, 4, 8, 4px, 2em, [4], $tabSize
hyphens
Interactive example.
Prefixes: hyphens. Example: hyphens:none. It emits hyphens:none;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (5)
none, manual, auto, [manual], $hyphens
hyphenate-character
Interactive example.
Prefixes: hyphenate-character. Example: hyphenate-character:auto. It emits hyphenate-character:auto;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (2)
auto, $hy
hyphenate-limit-zone
Interactive example.
Prefixes: hyphenate-limit-zone. Example: hyphenate-limit-zone:0. It emits hyphenate-limit-zone:0px;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (5)
0, 2, 25%, [4em], $zone
hyphenate-limit-chars
Interactive example.
Prefixes: hyphenate-limit-chars. Example: hyphenate-limit-chars:auto. It emits hyphenate-limit-chars:auto;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (6)
auto, 0, 2, 6, [auto_3_4], $chars
hyphenate-limit-lines
Interactive example.
Prefixes: hyphenate-limit-lines. Example: hyphenate-limit-lines:no-limit. It emits hyphenate-limit-lines:no-limit;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (5)
no-limit, 0, 1, 2, $lines
hyphenate-limit-last
Interactive example.
Prefixes: hyphenate-limit-last. Example: hyphenate-limit-last:none. It emits hyphenate-limit-last:none;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (7)
none, always, column, page, spread, [spread], $last
vertical-align
Interactive example.
Prefixes: vertical-align. Example: vertical-align:baseline. It emits vertical-align:baseline;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (13)
baseline, sub, super, text-top, text-bottom, middle, top, bottom, 10px, -0.2em, 50%, [middle],
$verticalAlign
line-grid
Interactive example. Maturity: experimental. Browser support: CSS Rhythmic Sizing draft feature with limited browser support.
Prefixes: line-grid. Example: line-grid:match-parent. It emits line-grid:match-parent;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (4)
match-parent, create, [create], $grid
line-snap
Interactive example. Maturity: experimental. Browser support: CSS Rhythmic Sizing draft feature with limited browser support.
Prefixes: line-snap. Example: line-snap:none. It emits line-snap:none;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (5)
none, baseline, contain, [baseline], $snap
line-fit-edge
Interactive example.
Prefixes: line-fit-edge. Example: line-fit-edge:leading. It emits line-fit-edge:leading;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (6)
leading, text, ideographic, ideographic-ink, [cap_alphabetic], $lineFitEdge
line-padding
Interactive example.
Prefixes: line-padding. Example: line-padding:0. It emits line-padding:0px;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (5)
0, 2, 0.5em, [0.5em], $linePadding
line-height-step
Interactive example.
Prefixes: line-height-step. Example: line-height-step:0. It emits line-height-step:0;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (5)
0, 6, 24px, [calc(1lh+4px)], $step
box-snap
Interactive example. Maturity: experimental. Browser support: CSS Rhythmic Sizing draft feature with limited browser support.
Prefixes: box-snap. Example: box-snap:none. It emits box-snap:none;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (8)
none, block-start, block-end, center, baseline, last-baseline, [baseline], $snap
baseline-source
Interactive example.
Prefixes: baseline-source. Example: baseline-source:auto. It emits baseline-source:auto;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (5)
auto, first, last, [first], $baselineSource
baseline-shift
Interactive example.
Prefixes: baseline-shift. Example: baseline-shift:sub. It emits baseline-shift:sub;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (10)
sub, super, top, center, bottom, 10px, -0.2em, 50%, [10px], $baselineShift
dominant-baseline
Interactive example.
Prefixes: dominant-baseline. Example: dominant-baseline:auto. It emits dominant-baseline:auto;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (11)
auto, text-bottom, alphabetic, ideographic, middle, central, mathematical, hanging, text-top, [central], $dominantBaseline
alignment-baseline
Interactive example.
Prefixes: alignment-baseline. Example: alignment-baseline:baseline. It emits alignment-baseline:baseline;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (10)
baseline, text-bottom, alphabetic, ideographic, middle, central, mathematical, text-top, [text-before-edge], $alignmentBaseline
block-step
Interactive example.
Prefixes: block-step. Example: block-step:[24px_padding-box_start_nearest]. It emits block-step:24px padding-box start nearest;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (2)
[24px_padding-box_start_nearest], $value
block-step-size
Interactive example.
Prefixes: block-step-size. Example: block-step-size:none. It emits block-step-size:none;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (6)
none, 0, 6, 24px, [calc(1lh+4px)], $step
block-step-insert
Interactive example.
Prefixes: block-step-insert. Example: block-step-insert:margin-box. It emits block-step-insert:margin-box;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (5)
margin-box, padding-box, content-box, [padding-box], $insert
block-step-align
Interactive example.
Prefixes: block-step-align. Example: block-step-align:auto. It emits block-step-align:auto;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (6)
auto, center, start, end, [center], $align
block-step-round
Interactive example.
Prefixes: block-step-round. Example: block-step-round:up. It emits block-step-round:up;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (5)
up, down, nearest, [nearest], $round
inline-sizing
Interactive example.
Prefixes: inline-sizing. Example: inline-sizing:normal. It emits inline-sizing:normal;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (4)
normal, stretch, [stretch], $inlineSizing
writing-mode
Interactive example.
Prefixes: writing-mode. Example: writing-mode:horizontal-tb. It emits writing-mode:horizontal-tb;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (7)
horizontal-tb, vertical-rl, vertical-lr, sideways-rl, sideways-lr, [vertical-rl], $writingMode
direction
Interactive example.
Prefixes: direction. Example: direction:ltr. It emits direction:ltr;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (4)
ltr, rtl, [rtl], $direction
unicode-bidi
Interactive example.
Prefixes: unicode-bidi. Example: unicode-bidi:normal. It emits unicode-bidi:normal;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (8)
normal, embed, isolate, bidi-override, isolate-override, plaintext, [isolate], $bidi
text-orientation
Interactive example.
Prefixes: text-orientation. Example: text-orientation:mixed. It emits text-orientation:mixed;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (5)
mixed, upright, sideways, [upright], $orientation
text-combine-upright
Interactive example.
Prefixes: text-combine-upright. Example: text-combine-upright:none. It emits text-combine-upright:none;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (5)
none, all, digits, [digits_2], $combine
ruby-position
Interactive example.
Prefixes: ruby-position. Example: ruby-position:alternate. It emits ruby-position:alternate;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (6)
alternate, over, under, inter-character, [alternate_under], $position
ruby-align
Interactive example.
Prefixes: ruby-align. Example: ruby-align:start. It emits ruby-align:start;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (6)
start, center, space-between, space-around, [center], $align
ruby-merge
Interactive example.
Prefixes: ruby-merge. Example: ruby-merge:separate. It emits ruby-merge:separate;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (5)
separate, merge, auto, [merge], $merge
ruby-overhang
Interactive example.
Prefixes: ruby-overhang. Example: ruby-overhang:auto. It emits ruby-overhang:auto;. Also accepts the CSS-wide keywords inherit, initial, revert, revert-layer, and unset.
Documented values (5)
auto, spaces, none, [auto], $overhang