Buttons component
.button
[type=submit]
.button_spacy
.button_label
.button_primary
.button_success
.button_warning
.button_danger
.button_white
.button_black
.button_clear
.button_dropdown
.buttons-group
Colors tokens
Text
.color-primary
.color-success
.color-warning
.color-danger
.color-error
.color-black
.color-white
.color-grey
Background
.bg-primary
.bg-success
.bg-warning
.bg-danger
.bg-error
.bg-black
.bg-white
.bg-grey
Flex + s/m/l/xl
Container
.flex
.s:flex
.m:flex
.l:flex
.xl:flex
Direction and wrap
.fr
.fc
.fw
.fnw
Alignment
.ais
.aifs
.aic
.aife
.jcfs
.jcc
.jcfe
.jcsb
.jcsa
.jcse
Items
.no-shrink
.no-grow
.c1/2
.c1/3
.c2/3
.c1/12...c11/12
Grid + s/m/l/xl
Container
.grid
.g1...g12
Children
.c1...c12
.c1/12
.c2/12
.c5/11
.c6/12
Self alignment
.jss
.jse
.jsc
.jsstr
.ass
.ase
.asc
.asstr
Flow and space + s/m/l/xl
.flow
.flow.s0...s10
.flow.m:s0...m:s10
.space0...space10
.sticky
Text helpers utility
.antialiased
.container
.unselectable
.unclickable
.upper
.lower
.capitalize
.nowrap
.hyphens
.pointer
.toe
.breakWord
Line clamp
.lc0...lc5
.s:lc0...xl:lc5
Position + s/m/l/xl
.oh
.fix
.rel
.abs
.inset
.fill
.t0...t10
.b0...b10
.l0...l10
.r0...r10
.t0n...r10n
.z0...z10
Display + s/m/l/xl
.hidden
.hidden-next
.block
.inline
.inlineBlock
.table
.flex
.grid
.visuallyHidden
.invisible
.no-print
.touch-show
.touch-hide
Object and ratio + s/m/l/xl
Object fit
.fit-cover
.fit-contain
.s:fit-none
.s:fit-cover
.s:fit-contain
Ratio
.ratio1x1
.ratio2x1
.ratio3x1
.ratio4x1
.ratio3x2
.ratio4x3
.ratio16x9
.ratio1x2
.ratio1x3
.ratio1x4
.ratio2x3
.ratio3x4
.ratio9x16
Sizing + s/m/l/xl
.fullscreen
.wmax
.hmax
.wscreen
.hscreen
.max
.w2...w38 step 2
.h2...h38 step 2
.h40...h80 step 10
.w40...w160 step 10
.max2...max160
.min2...min160
Spacing + s/m/l/xl
Margin
.m0...m10
.mx0...mx10
.my0...my10
.mt0...mr10
.m0n...mr10n
.ma
.mxa
.mya
.mta
.mba
.mla
.mra
Padding and gap
.p0...p10
.px0...px10
.py0...py10
.pt0...pr10
.gap0...gap10
.gapx0...gapx10
.gapy0...gapy10
Visual utility + s/m/l/xl
.br0...br10
.br100
.sh0...sh5
.o0...o10
.op0...op10
Typography base + utility
Base
h1...h6
.h1...h6
p
figure
figcaption
blockquote
pre
ul/ol/dl
table
Utility
.mono
.italic
.strike
.fs10...fs19 step 1
.fs20...fs100 step 2
.fw100...fw900
.ls0...ls4
.lh0...lh9
.al
.ar
.ac
.aj
Links base
a
a.link
a.hover
a.active
a.link_noline
a.link_underline
a.link_dashed
a.link_dotted
a.link_wavy
a[href^="tel"]
Forms base
input
textarea
select
button
[readonly]
[disabled]
.error
[pattern]:invalid
::placeholder
Scroll component
.scroll
.scroll_x
.scroll_y
.scroll_contain
.scroll_x-proximity
.scroll_x-mandatory
.scroll_align-center
.scroll_align-end
.scroll-responsive
Icons + m/l
.icon
.icon10...icon60 step 2
.m:icon10...m:icon60
.l:icon10...l:icon60
Dropdown component
.dropdown
[x-dropdown]
.dropdown_right
.dropdown_bottom
.dropdown_ready
.dropdown_open
.dropdown_wrap
li.divider
.focus-visible
Modal component
[x-modal]
.modal
.modal_ready
.modal_active
.modal_z1...modal_z10
.modal-overlay
.modal-outer
.modal-inner
.modal-window
.modal-rail
.modal-close
Effects
.modal_effect-in
.modal_effect-out
.modal_effect-up
.modal_effect-down
.modal_effect-left
.modal_effect-right
Slider and sheets component
Slider
.slider
.slider_touch
.slider-wrapper
.slider-item
.slider-indicators
[x-slider]
Sheets
[x-sheet]
.active