Agent skill · earthtojake
smui
smui — an agent skill for coding agents.
What it needs
About 6k tokens when loaded.
What this skill does
smui — Terminal Theme for the CAD Viewer UI Local copy of the smui ("spacemolt") design system (<https://smui.statico.io/skill.md>), adapted for the CAD Viewer. smui is a Nord-inspired terminal aesthetic for shadcn/ui with light and dark modes: sharp edges, monospace everything. Read this whole document before restyling viewer UI. The design rules below are kept agnostic so they transfer to any shadcn/ui app. The "In this app" section is the only viewer-specific part — most notably, this app keeps translucent frosted-glass surfaces instead of smui's flat opaque panels, because viewer panels float over a live 3D scene. --- In this app (CAD Viewer) This app is Vite + Tailwind v4, not Next.js, so ignore the upstream next/font and next-themes instructions — the equivalents here are: Tokens live in src/client/styles/globals.css. The shadcn CSS variables are set directly in :root (light "Snow Storm") and .dark (dark "Polar Night"); the Tailwind v4 @theme inline block maps them to utilities and sets --radius to 0. Do not run npx shadcn add — edit globals.css by hand. Font (app divergence): this app does NOT adopt smui's monospace. It keeps the viewer's previous typeface — --font-sans: "IBM Plex Sans", "Aptos", "Segoe UI", sans-serif. So skip smui's "monospace everything" rule and the JetBrains Mono setup; everything else (palette, sharp edges) still applies. Light/dark is driven by the viewer's own color-scheme system, which toggles the .dark class on <html> — no next-themes. App modification: translucent frosted-glass surfaces smui ships flat, opaque surfaces. This app intentionally keeps its frosted-glass look so the 3D model shows through panels. Honor that: Surfaces read their background from --ui-glass-surface / --ui-glass-popover / --ui-glass-control, which are translucent (color-mix(... <pct>%, transparent)) and tinted by the smui --sidebar / --popover / --background tokens. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills earthtojake/smui