irrlicht-design
Use this skill to generate well-branded interfaces and assets for Irrlicht, either for production or throwaway prototypes/mocks/etc. Contains essential design guidelines, colors, type, fonts, assets, and UI kit components for prototyping.
Best use case
irrlicht-design is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
Use this skill to generate well-branded interfaces and assets for Irrlicht, either for production or throwaway prototypes/mocks/etc. Contains essential design guidelines, colors, type, fonts, assets, and UI kit components for prototyping.
Teams using irrlicht-design should expect a more consistent output, faster repeated execution, less prompt rewriting.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/irrlicht-design-system/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How irrlicht-design Compares
| Feature / Agent | irrlicht-design | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
Use this skill to generate well-branded interfaces and assets for Irrlicht, either for production or throwaway prototypes/mocks/etc. Contains essential design guidelines, colors, type, fonts, assets, and UI kit components for prototyping.
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
SKILL.md Source
Read the `README.md` file within this skill, and explore the other available files. If creating visual artifacts (slides, mocks, throwaway prototypes, etc), copy assets out and create static HTML files for the user to view. If working on production code, you can copy assets and read the rules here to become an expert in designing with this brand. If the user invokes this skill without any other guidance, ask them what they want to build or design, ask some questions, and act as an expert designer who outputs HTML artifacts _or_ production code, depending on the need. ## Quick orientation - `README.md` — company context, content & visual fundamentals, iconography - `colors_and_type.css` — all design tokens (CSS vars) — import this first - `preview/` — small specimen cards for every token cluster - `ui_kits/dashboard/` — the dense data view (session list, Gas Town, pressure alerts) - `ui_kits/landing/` — the marketing surface (serif hero, three lights, install pill) - `assets/` — logos and icon sources ## Non-negotiables - Three semantic colors only: **working (#8B5CF6 purple)**, **waiting (#FF9500 orange)**, **ready (#34C759 green)**. Never decorative. - Type pairing: **Cormorant Garamond 300** (display, italic) + **Outfit 300/500** (UI sans) + **DM Mono** (data, labels, logo) - Background is near-black with a subtle purple-to-black radial and fixed fractal-noise overlay at ~3% opacity - Lowercase UI prose. Em-dashes over colons. Never exclamation points. - The logo lock-up is lowercase `irr` + `licht` with the second half in purple
Related Skills
ir:triage
Autonomously triage GitHub issues on ingo-eichhorst/Irrlicht. Diagnostic-only: scores each issue against a 6-axis readiness rubric and lands it at ready-for-agent or needs-info, with a one-line justification per label. Triggers: "/ir:triage" (sweep), "/ir:triage #N" (single), "/ir:triage #N #M".
ir:test-mac
Build and run a dev irrlicht daemon + macOS Swift app for local testing. Asks whether to run a SEPARATE instance alongside production (isolated state, port 7838 — production keeps running) or to REPLACE the running production versions (production port 7837 + production state, so the statusline quota feed and existing sessions show up). Use when the user says "test mac", "restart mac", "rebuild mac", or "/ir:test-mac".
ir:release
Build and publish an irrlicht release. Bumps version, builds Go daemon + Swift app, creates signed app bundle with icon, packages DMG (branded installer) + PKG, updates docs/changelog/landing page, commits, tags, pushes, and creates GitHub release with assets. Default: patch bump. Use "/ir:release minor" or "/ir:release major".
ir:refresh-aliases
Sync irrlicht's model-name alias map against codeburn's upstream BUILTIN_ALIASES. Fetches codeburn's src/models.ts, diffs entries against core/pkg/capacity/aliases.go, and proposes additions/changes as a PR. Use when user says '/ir:refresh-aliases', 'refresh aliases', 'sync codeburn aliases', 'check alias map', or when a session prices at $0 for a known model.
ir:onboarding-factory/record
Carry one assessed cell to a committed, verified recording: check prerequisites, port any missing driver step, drive the live agent CLI under a recording daemon via `of record run`, verify EVERY websocket observation (state + model + cost + tokens + agent) via `of record verify`, refresh the replay golden, and commit. Backflows a correction into the cell when the live recording disagrees with the assessment. Invoked as `/ir:onboarding-factory record <agent> <scenario>`.
ir:onboarding-factory/create-scenario
Add a brand-new scenario ROW to the matrix: one agent-agnostic `{id, name, description, acceptance_criteria, process}` entry written through `of scenario add`. Researches how the behavior manifests across every onboarded agent (and what the daemon would observe) before synthesizing the agent-agnostic spec. No agent CLI invocation, no recording. Invoked as `/ir:onboarding-factory create-scenario <slug>`.
ir:onboarding-factory/create-agent
Onboard a brand-new agent CLI as a matrix COLUMN: research its identity + recording prerequisites, register it via `of agent add`, scaffold its interactive driver from the template, and predict which step types each scenario's recipe will need (the driver-needs punch-list). No live recording. Invoked as `/ir:onboarding-factory create-agent <slug>`.
ir:onboarding-factory/assess
Judge one (agent, scenario) cell across the three pillars — agent capability, daemon sensor capture, driver capability — on cited evidence, then author the cell's recipe and machine-checkable spec. Writes the cell metadata via `of cell write` and the spec (expected.jsonl) via `of cell spec`. No live recording. Invoked as `/ir:onboarding-factory assess <agent> <scenario>`.
ir:onboarding-factory
Maintain the canonical scenario × agent fixture matrix for irrlicht. A slim dispatcher that routes intent to four focused subagents — `create-scenario` (add a matrix row), `create-agent` (add a matrix column), `assess` (judge one cell across the three pillars and write its spec), and `record` (drive the live agent and verify every websocket observation). Every read and every write goes through the `of` factory CLI (tools/onboarding-factory) — the skill itself never touches `replaydata/`. Each subagent returns a ≤6-line summary so the parent keeps its context for strategic decisions instead of drowning in per-cell tool output. Use when the user says "/ir:onboarding-factory", "onboard agent", "add a scenario", "assess fixtures", "record fixtures", or "regenerate recordings".
ir:agent-landscape
Scan the web for coding agents and agent orchestrators, track GitHub stars and trends, rank by popularity+momentum, and publish a report to the irrlicht site. Shows which agents irrlicht already supports. Use when user says 'agent landscape', 'scan agents', 'coding agent tracker', 'agent popularity', '/ir:agent-landscape', or wants to see the competitive landscape of coding agents.
You are a professional Landing page designer who is very friendly and supportive.
Your task is to guide a beginner through planning and designing a landing page or personal portfolio.
frontend-design
Create distinctive, production-grade frontend interfaces with intentional aesthetics, high craft, and non-generic visual identity. Use when building or styling web UIs, components, pages, dashboard...