WARDROBE / BRICK BR-68 / MK-1

Brick

Hardware aesthetics for software builds. Embossed panels. Raised buttons. Tactile feel.

TOKENSREV-A

Casing + ground

--color-bg#C8C9C4 — outside the device
--color-casing#E3E4DF — panel surface
--color-terminal#DCDDDA — inset display
--color-fg#1A1A1A — primary text + button fill

Functional palette (ABS-style studs)

--color-red #D03027
--color-blue #0055A4
--color-yellow #F2A900
--color-green #00853E
--color-white #F4F4F2

Typography

DISPLAY · INTER 600
Modular block
requisition system.
MONO · JETBRAINS MONO 700
STATION-44-09
STATUS · DELIVERED
ID · 3001-R

Shadows (multi-layer is the signature)

--shadow-device Drop + inset highlight + inset shadow. Used on the full panel frame.
--shadow-tile Drop + double inset. Used on cards and catalog tiles.
--shadow-button-raised Single drop. Primary buttons sit above the surface.
--shadow-inset-input Inverted shadow. Inputs feel like they sink into the casing.

COMPONENTS10 / 10

Button.

Bracketed JBM CAPS. Primary is solid black with a raised drop-shadow. Secondary is a casing-tinted button with embossed border. Press translates 1px down.

Input.

Inset well, no outer border. JBM. Focus pulls a 1px bottom-border to fg. Placeholder reads as a CAPS hint.

Textarea.

Same well treatment as Input — taller. Inset shadow, JBM body.

Select.

Inset well plus chevron-svg. Caps the value, sharp 4px corners.

Card.

Default = casing tile with multi-layer shadow. Recessed = inset gap. Device = the full hardware frame.

3001-R
UNIT COUNT
1,200
3002-B
QUEUED
08
MK-1
Device frame
used for hero sections

Badge.

Status-code chip. Tinted background, JBM bold CAPS, 2px corners. ok/proc/wait/archive picks the text color.

DELIVEREDIN_TRANSITQUEUEDARCHIVEDSYSTEM

Dialog.

Full device-panel. Embossed header divider. Title in Inter, model-number JBM. Backdrop is half-black.

Tabs.

Mechanical key-row. Inactive tabs are casing-tinted with embossed border. Active is solid fg + drop shadow — feels pressed.

Switch.

Physical toggle: inset track, raised thumb. Checked = green track and the thumb slides 20px.

Toast.

Slide-in status display. White card, multi-layer tile shadow, color-coded left border. JBM CAPS title in brackets, JBM timestamp top-right.

INSTALL30 SEC

One paste. Brick lands in your project complete with tokens, fonts, and all 10 components — ready to wear hardware.

[ BIG GREEN INSTALL BUTTON → ]

MCP_COMING_SOONv0.NEXT

The Wardrobe MCP server is on the bench. Soon you'll just say "install Brick" and the requisition completes itself.

SEE_IT_LIVEBAUSTEIN

Baustein — a fictional modular block requisition system. Brick end-to-end across catalog, detail, cart, and log.