disler

Light Mode Theming — Design skill for Claude Code

Design community

Add a light mode to contrast the default dark mode, and build the design system so that.

How to install Light Mode Theming

Installs to ~/.claude/skills/disler-inkwell-agent-sandboxes-and-software-factory-light-mode-theming/SKILL.md

Terminal
mkdir -p ~/.claude/skills/disler-inkwell-agent-sandboxes-and-software-factory-light-mode-theming && curl -fsSL https://raw.githubusercontent.com/disler/inkwell-agent-sandboxes-and-software-factory/HEAD/prompts/light-mode-theming.md -o ~/.claude/skills/disler-inkwell-agent-sandboxes-and-software-factory-light-mode-theming/SKILL.md

Restart Claude Code, or start a new session, for it to be picked up.

What Light Mode Theming does

Add a light mode to contrast the default dark mode, and build the design system so that additional themes can be added later. Themes should be defined as named sets of design tokens rather than hardcoded colors, with the dark theme remaining the default. Where: apps/inkwell/public/style.css (tokens + themes), apps/inkwell/public/app.js (theme toggle + persistence), apps/inkwell/public/index.html (control markup). Done means: the user can switch between dark and light from the UI, the choice pers

Alternatives in Design

  • Add Oas Support — Add support for a new OpenAPI Specification version to Swagger UI 29k ★
  • NotebookLM Automation — Complete programmatic access to Google NotebookLM—including capabilities not exposed in the web UI 6.8k ★
  • Studio — Launch the local design Studio — a live token editor over the latest extraction 3.6k ★

Full documentation available on GitHub

View Source Repository