Design systemPro

PALLAS

A night-shift system for equipment, logistics and field-service brands: lit signs, a sodium beacon and photographs to the edges.

Everything on the bench is live. Hover it, type in it, tab through it, or flip Desk.

About the system

Built from: PALLAS website
Components: 52 in 7 groups, every state
Typefaces: Geist, Geist Mono
Desk: The depot desk keeps hours; the breakdown line never closes. Open, every call is a lit white sign. After hours the signs that need the desk switch off to a hairline, the night line lights up in sodium with a faster beacon, and status lines, captions and the navigation's plate change with it. It can follow the clock on its own.
Format: HTML, CSS and JavaScript with no dependencies, plus DESIGN.md
Version: 1.0

A machine line page for articulating booms, with rates and a request that prints as you answer. It ships as the starter, ready to rename.

DESIGN.md: Rules for building with the system, written to hand to Claude, Lovable or a developer
tokens/tokens.json: Every colour, size, space and timing as named tokens
tokens/tokens.css: The same tokens as CSS variables, including the lit room
css/pallas.css: All components and their states, and the desk's open and after-hours looks
js/pallas.js: Desk and clocks, scenes, tabs, option lists, the manifest, finder, dialogs, toasts and the navigation. No dependencies
components.html: Every component in every state, side by side
starter/index.html: A machine line page with rates and a live request, built only from the system
assets/imagery/: Night shift, lit room and catalogue photographs at full resolution
LICENSE.md: Commercial use in your own and client projects

Attach DESIGN.md
Add it to your conversation in Claude, Lovable or any AI builder.
Describe your page
In your own words, with your own brand and content.
Keep the code or port it
Link the token and component CSS, or ask for React. The rules hold either way.

Layout: Full-bleed scene, Shot timeline, Twelve-column grid, Hairline rows, Figure row, Lit room
Actions: Plate, Switched-off plate, Night line plate, Call row, Icon button, Text link, Finder field
Input: Text field, Select, Long text, Unit field, Range, Option list, Checkbox, Beacon radio, Switch, Quantity, Filter chips
Data: Index bars, Word tabs, Spec row, Counter, Rates table, Request manifest, Lift ruler
Status: Desk status, Clock, Tag, Notice, Subtitle, Progress, Step rail, Toast, Stamp
Content: Scene slider, Tall panel, Catalogue tile, Case, Result row
Overlay and navigation: Dialog, Finder drawer, Navigation bar, Drop sheet, Mobile menu, Mobile bar, Footer wordmark

See the full website the system comes from.