makepad-2.0-dsl — Claude Code skill: what it does, how to install
Teaches agents Makepad 2.0 DSL syntax, Splash runtime scripts, property merging, and Rust widget registration.
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-dsl -a claude-codeWhat makepad-2.0-dsl does
Makepad 2.0 shifted from compile-time templates to runtime evaluation using Splash and the script_mod! macro. This skill directs coding assistants to apply the refreshed rules: colons replace equals signs, commas between siblings are dropped, and := declares addressable widget instances. Those instances end up in object vectors and resolve via id! in Rust.
The guidance covers property merging mechanics. Using +: or dot paths modifies targeted fields without wiping existing borders or hover states. On the Rust side, structs tied to the script engine must include #[source] source: ScriptObjectRef. Registration sequence is critical: registering UI screens before their underlying widget modules will break initialization at runtime.
What it helps with
- Migrate legacy
live_design!layouts to Makepad 2.0script_mod!blocks - Apply partial style updates using
+:without wiping default parameters - Create addressable widget instances using
:=for Rust lookup viaids! - Sequence widget and UI module registrations correctly in Rust code
Example prompts for the agent
- Convert this legacy Makepad component to the 2.0 script_mod! format
- Demonstrate how to update border radius using dot-path shorthand in Makepad 2.0
- Write a custom widget Rust struct definition using Script and ScriptHook derives
How to install makepad-2.0-dsl
1Skills CLI (Vercel)
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-dsl -a claude-code2Manually: put the files in place
~/.claude/skills/makepad-2.0-dsl/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/makepad-2.0-dsl/
1Skills CLI (Vercel)
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-dsl -a codex2Manually: put the files in place
.agents/skills/makepad-2.0-dsl/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-dsl -a cursor2Manually: put the files in place
.cursor/skills/makepad-2.0-dsl/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install ZhangHanDong/makepad-skills makepad-2.0-dsl2Manually: put the files in place
.github/skills/makepad-2.0-dsl/SKILL.md1Skills CLI (Vercel)
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-dsl -a gemini-cli2Platform CLI
gemini skills install https://github.com/ZhangHanDong/makepad-skills --path skills/makepad-2.0-dslManually: put the files in place
.devin/skills/makepad-2.0-dsl/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-dsl -a opencodeClaude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
Step by step, with commands for each platform: How to install skills in Claude Code: five ways
Questions about makepad-2.0-dsl
How to install makepad-2.0-dsl in Claude Code?
Run npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-dsl -a claude-code or place the definition file into ~/.claude/skills/makepad-2.0-dsl/SKILL.md.
What does makepad-2.0-dsl do?
It provides syntax constraints and architecture patterns for Makepad 2.0, helping coding assistants generate valid Splash DSL and matching Rust bindings.
Why is registration order critical in Makepad 2.0?
Base widgets and custom widget types must register with the script engine before UI modules execute. If the UI loads first, the runtime cannot find the widget types.
