Skip to content
Site volume
Colourway

Tokens

Volume and switches tokens

The 40 volume and switches tokens with their values in the current look.

40 of 40 tokens

Volume and switches tokens
TokenValue in this lookVaries byIn codeDescription
--mk-blendblendvar(--mk-t-bone, var(--mk-blend--b)) var(--mk-t-night, var(--mk-blend--n))colourwaytheme
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
How overlapping inks print: multiply on Bone, screen on Night.
--mk-themetheme0themevolumecontrastsecond-ink
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
The theme as a number: 0 Bone, 1 Night.
--mk-volume-basevolume.base1themevolumecontrastsecond-ink
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
The authored volume as a number, 0 Quiet to 3 Rave.
--mk-volumevolume1themevolumecontrastsecond-ink
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
The resolved volume as a number (the visitor's dial wins), 0 to 3.
--mk-contrastcontrast0themevolumecontrastsecond-ink
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
The contrast as a number: 0 normal, 1 more.
--mk-ov-modeov.mode2themevolumecontrastsecond-ink
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
The second ink's mode as a number: off, motion or rest.
--mk-ov-onov.oncalc(min(1, var(--mk-ov-mode)) * min(1, var(--mk-volume)) * (1 - var(--mk-contrast)))themevolumecontrastsecond-ink
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
Whether the second ink prints on display type (0 or 1).
--mk-ov-on-headov.on.headcalc(min(1, var(--mk-ov-mode)) * min(1, max(0, var(--mk-volume) - 1)) * (1 - var(--mk-contrast)))themevolumecontrastsecond-ink
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
Whether the second ink prints on section heads (0 or 1).
--mk-w-quietw.quietmax(0, 1 - var(--mk-volume))themevolumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
A cascade weight: 1 at Quiet, else 0.
--mk-w-studiow.studiomax(0, 1 - (var(--mk-volume) - 1) * (var(--mk-volume) - 1))themevolumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
A cascade weight: 1 at Studio, else 0.
--mk-w-pressw.pressmax(0, 1 - (var(--mk-volume) - 2) * (var(--mk-volume) - 2))themevolumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
A cascade weight: 1 at Press, else 0.
--mk-w-ravew.ravemax(0, var(--mk-volume) - 2)themevolumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
A cascade weight: 1 at Rave, else 0.
--mk-w-bonew.bonecalc(1 - var(--mk-theme))themevolumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
A cascade weight: 1 on Bone, else 0.
--mk-w-nightw.nightvar(--mk-theme)themevolumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
A cascade weight: 1 on Night, else 0.
--mk-w-hcw.hcvar(--mk-contrast)themevolumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
A cascade weight: 1 under more contrast, else 0.
--mk-w-p3w.p3min(1, max(0, var(--mk-volume) - 1))themevolumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
A cascade weight: 1 where P3 colour prints, else 0.
--mk-w-cx-studiow.cx.studiocalc(1 - var(--mk-w-cx-old) - var(--mk-w-cx-neon))themevolumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
A cascade weight: 1 in the studio comic register, else 0.
--mk-w-cx-oldw.cx.oldcalc((1 - var(--mk-theme)) * var(--mk-w-press))themevolumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
A cascade weight: 1 in the old comic register, else 0.
--mk-w-cx-neonw.cx.neonmax(calc(var(--mk-theme) * (1 - var(--mk-w-quiet))), var(--mk-w-rave))themevolumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
A cascade weight: 1 in the neon comic register, else 0.
--mk-v-grainv.grain · art layercalc((var(--mk-w-studio) * 0.45 + (var(--mk-w-press) + var(--mk-w-rave)) * 0.55) * (1 - var(--mk-w-hc)))volumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
Grain on art, by volume.
--mk-v-texturev.texture · art layercalc(var(--mk-w-studio) * 1 + var(--mk-w-press) * 2 + var(--mk-w-rave) * 3)volumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
Which surfaces may carry texture, by volume (0 none to 3 any art).
--mk-v-sep-offv.sep.off · art layercalc(((var(--mk-w-studio) * 2 + var(--mk-w-press) * 3 + var(--mk-w-rave) * 5) * (1 - var(--mk-w-hc))) * 1px)volumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
How far art plates print off register, by volume.
--mk-v-sep-platesv.sep.plates · art layercalc(1 + ((var(--mk-w-studio) * 1 + (var(--mk-w-press) + var(--mk-w-rave)) * 3) * (1 - var(--mk-w-hc))))volumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
How many separations art prints, by volume.
--mk-v-plate-offsetv.plate.offset · art layercalc((var(--mk-w-studio) * 4 + var(--mk-w-press) * 6 + var(--mk-w-rave) * 8) * 1px)volumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
A printed plate's hard offset, by volume.
--mk-v-display-scalev.display.scale · art layercalc(var(--mk-w-quiet) * 0.92 + var(--mk-w-studio) * 1 + (var(--mk-w-press) + var(--mk-w-rave)) * 1.12)volumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
The display type scale, by volume.
--mk-v-display-wghtv.display.wght · art layercalc(var(--mk-w-quiet) * -30 + (var(--mk-w-press) + var(--mk-w-rave)) * 70)volumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
The display weight shift, by volume.
--mk-v-tilt-maxv.tilt.max · art layercalc((var(--mk-w-studio) * 3 + var(--mk-w-press) * 6 + var(--mk-w-rave) * 12) * 1deg)volumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
The most art may tilt, by volume.
--mk-v-specksv.specks · art layercalc(var(--mk-w-studio) * 5 + var(--mk-w-press) * 7 + var(--mk-w-rave) * 9)volumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
Stamp specks, by volume.
--mk-v-kracklev.krackle · art layercalc(var(--mk-w-studio) * 1 + var(--mk-w-press) * 2 + var(--mk-w-rave) * 4)volumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
Kirby krackle allowed, by volume.
--mk-slant-xslant.x · art layercalc((var(--mk-w-studio) * 5 + (var(--mk-w-press) + var(--mk-w-rave)) * 8) * 1%)volumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
How far comic gutters slant, by volume.
--mk-break-outbreak.out · art layercalc(((var(--mk-w-studio) + var(--mk-w-press) + var(--mk-w-rave)) * 48) * 1px)volumecontrast
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
How far broken-frame art may cross a panel's frame.
--mk-v-sfxv.sfx · art layerinline-blockthemevolume
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
Whether SFX show (hidden at Quiet).
--mk-v-loop-controlv.loop.control · art layernonethemevolume
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
Whether loop-bearing art shows its pause key.
--mk-a-popa.pop · art layermk-popthemevolume
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
Whether the pop entrance plays, by volume (none at Quiet).
--mk-a-landa.land · art layermk-landthemevolume
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
Whether the land entrance plays, by volume (none at Quiet).
--mk-a-wipea.wipe · art layermk-wipethemevolume
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
Whether the wipe entrance plays, by volume (none at Quiet).
--mk-a-snapa.snap · art layermk-snapthemevolume
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
Whether the snap entrance plays, by volume (none at Quiet).
--mk-a-flexa.flex · art layernonethemevolume
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
Whether the flex entrance plays, by volume (none at Quiet).
--mk-a-panela.panel · art layermk-panel-in-studiothemevolume
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
Whether the panel entrance plays, by volume (none at Quiet).
--mk-cx-art-blendcx.art.blend · art layervar(--mk-t-bone, var(--mk-cxab--b, var(--mk-blend--b))) var(--mk-t-night, var(--mk-cxab--n, var(--mk-blend--n)))themevolume
Tailwind
none
TS
CSS only (MkVar)
Swift
Not in Swift
How comic art plates blend, by register.