Makepad 2.0 Theme

by ZhangHanDong

Makepad 2.0 Theme is a Frontend skill for Claude Code, published by ZhangHanDong in makepad-skills.

745 stars87 forkson ZhangHanDong/makepad-skillsAdded 2026/08/23Repository updated 2026/04/07

View source on GitHub Download repo ZIP

appclaudeclaude-codecross-platformmakepadrustskills

Install in seconds

Install Makepad 2.0 Theme

Copy Makepad 2.0 Theme into your Claude Code skills folder. Run the command in your terminal, or review the source on GitHub before installing.

terminal

npx degit https://github.com/ZhangHanDong/makepad-skills/tree/main/skills/makepad-2.0-theme ~/.claude/skills/makepad-2.0-theme

Requires Node.js. Downloads this skill only — not the rest of the repository — into your Claude Code skills folder.

Without Node.js

git clone https://github.com/ZhangHanDong/makepad-skills.git

Clones the whole repository, then copy the skill’s own directory into your skills folder yourself.

In this catalog

Source file: skills/makepad-2.0-theme/SKILL.md in ZhangHanDong/makepad-skills
Installs to: ~/.claude/skills/makepad-2.0-theme
Collection: One of 14 skills cataloged from this repository
Category: Frontend — 567 skills

What Makepad 2.0 Theme does

Makepad 2.0 Theme provides the theme variables and built-in themes used in Splash scripts for colors, typography, spacing, and widget states. Use it when setting up app themes, switching dark and light modes, or styling UI with theme.* values instead of hardcoded numbers.

Makepad 2.0 Theme is cataloged under Frontend on DirSkills. Makepad 2.0 Theme comes from a repository tagged app, claude, claude-code, cross-platform and makepad.

Documentation

README

Excerpt

Makepad 2.0 Theme System

Overview

The Makepad 2.0 theme system provides a comprehensive set of design tokens accessed through theme.* variables in Splash scripts. It delivers consistent styling for colors, typography, spacing, and widget states across your entire application.

Three built-in themes are available:

mod.themes.dark -- dark desktop theme (default)
mod.themes.light -- light desktop theme
mod.themes.skeleton -- minimal skeleton theme with hardcoded values

Golden rule: Always use theme.* variables instead of hardcoded values for any color, font size, or spacing in production UIs. This ensures your app automatically supports theme switching and maintains visual consistency.

Theme Setup in App::run

This is the opening of the README. Read the full README on GitHub.

Frequently asked about Makepad 2.0 Theme

What else does ZhangHanDong publish alongside Makepad 2.0 Theme?
Makepad 2.0 Theme is one of 14 skills that DirSkills catalogs from ZhangHanDong/makepad-skills, the repository it ships in. Its siblings there include Makepad 1.x To 2.0 Migration, Makepad 2.0 App Structure and Makepad 2.0 DSL. Each one is a separate skill with its own page in this directory, installs the same way Makepad 2.0 Theme does, and is maintained by ZhangHanDong in that same repository. The rest of the collection is listed on the ZhangHanDong/makepad-skills page.
How does Makepad 2.0 Theme compare to other Frontend skills?
Makepad 2.0 Theme ranks #400 by stars among the 567 Frontend skills in this catalog. The most-starred ones next to it are Angular Developer, Android Clean Architecture and Accessibility. DirSkills ranks by the star count of the repository each skill ships in, so that order reflects how popular those repositories are rather than any review of Makepad 2.0 Theme against them. Open each page to compare what they document and how they install.