Stickers mark state or provenance (Taking projects, New, Shipped), never decoration only. The face is a reading plate printed in a sanctioned sticker pair; the kiss-cut white edge, the lift and the peeled corner are art around it. On arrival it pops in at a small lean and settles to 0°.
Example#
Q4 2026Taking projects
Usage#
Use a sticker to mark a state or where something came from: "Taking projects", "New", "Shipped". It is never decoration only (D-E4): every sticker says something.
- Shapes.
pill(default),rect,scallop,circleandcorner-cut(which canpeel). - Sizes.
sandmfor labels;lis a 124 px round with a display numeral and a line, such as "Q4 2026". - Ink. The face prints in a sanctioned sticker pair;
glyphadds a shape beside the words, never instead of them. - Arrival. It lands leaning and settles square; the lean comes from
leanKey, so it is the same on every visit.
Layer and volume#
Composite: the face is a plate (0° at rest), the edge, lift and peel are art. Quiet forces flat and no arrival; Studio allows one per row or card and three per view; Press five; Rave eight, peel art allowed. The arrival lean grows with the volume, capped at 6°.
Anatomy#
Q4 2026Taking projects
- FaceA reading plate in a sticker pair, square at rest.
data-mk-part="face" - NumeralLarge stickers only.
.mk-sticker-numeral - PeelArt: the folded corner.
.mk-sticker-peel
Volume#
Quiet
Q4 2026Taking projectsStudio
Q4 2026Taking projectsPress
Q4 2026Taking projectsRave
Q4 2026Taking projects
Content#
- Two or three words, sentence case: "Taking projects", "Fresh by noon".
- Status and provenance, not slogans. A sticker that says "Amazing!" says nothing.
Do and don't#
Do
Taking projects
Don't
Wow!
Accessibility#
- The label is real text; a glyph sits beside it, never instead of it.
- Empty children render nothing (a development error is logged).
- Under reduced motion it appears at rest (a 140 ms fade).
Props#
| Prop | Type | Default | Description |
|---|---|---|---|
shape | StickerShape | none | |
ink | StickerInk | paper | The face (default `paper`). |
size | StickerSize | none | s 1.5 rem tall, m 2 rem, l 7.75 rem (round shapes are always `l`). |
glyph | GlyphName | none | A shape glyph before the label (0.8125 rem); never the only sign of the state. |
numeral | string | none | `l` only: the display numeral above the line ("Q4 2026"). |
peel | boolean | none | A folded corner (`corner-cut` only). |
flat | boolean | none | No kiss-cut edge, no lift, no arrival (forced at Quiet). |
leanKey | string | none | Picks the arrival lean from {−2.4, 1.6, −1.1, 2.2, −1.8}° (default: the label). |
children required | ReactNode | none | The label; required and non-empty. |
Tokens#
System tokens (50)
--mk-a-land--mk-dur-hover--mk-dur-reduced--mk-dur-sticker-pop--mk-dur-sticker-pop-delay--mk-ease-out--mk-ease-pop--mk-font-display--mk-font-text--mk-ink--mk-pair-sticker-a-bg--mk-pair-sticker-a-fg--mk-pair-sticker-ink-bg--mk-pair-sticker-ink-fg--mk-pair-sticker-k-bg--mk-pair-sticker-k-fg--mk-pair-sticker-lead-bg--mk-pair-sticker-lead-fg--mk-pair-sticker-m-bg--mk-pair-sticker-m-fg--mk-pair-sticker-paper-bg--mk-pair-sticker-paper-fg--mk-pair-sticker-r-bg--mk-pair-sticker-r-fg--mk-pair-sticker-spot-bg--mk-pair-sticker-spot-fg--mk-pair-sticker-support-bg--mk-pair-sticker-support-fg--mk-pair-sticker-wood-bg--mk-pair-sticker-wood-fg--mk-pair-sticker-y-bg--mk-pair-sticker-y-fg--mk-radius-chip--mk-shadow-soft--mk-space-1--mk-space-2--mk-space-3--mk-space-4--mk-space-5--mk-type-control-sm-leading--mk-type-control-sm-size--mk-type-control-sm-tracking--mk-type-control-sm-weight--mk-type-label-leading--mk-type-label-size--mk-type-label-tracking--mk-type-label-weight--mk-w-press--mk-w-quiet--mk-w-rave
Its own properties (16)
--mk-kiss-cut--mk-kiss-cut-w--mk-lean--mk-shadow-sticker--mk-sticker-bg--mk-sticker-cut--mk-sticker-edge--mk-sticker-fg--mk-sticker-h--mk-sticker-lean-k--mk-sticker-lift--mk-sticker-numeral-leading--mk-sticker-numeral-size--mk-sticker-numeral-wdth--mk-sticker-pad--mk-sticker-radius
Changelog#
Arrived in 0.1.0.
- The print and comic kits, P0 (21 P2-T11 to P2-T15): the art core (seeded halftone, bursts, balloons, lines, krackle, printer's marks, SFX layers, the texture tiles and
gen-print-tiles), the print kit (Halftone,Overprint,PrinterMarks,Sticker,Stamp,Seal,useStampLand,Tape,Grain,Misregistrationand the.mk-ovsecond ink,GiantGlyph,ShapeGlyph), the dataCover(grid and score,coverAlt,CoverLegend), the comic registers and kit (Panel,PanelGrid,Balloon,Caption,CornerBox,EditorsNote,ContinuedIn,SFX,SfxBurst,SpeedLines,FocusLines,ImpactStar,KeyPop).