Skip to main content
skill CX Codex

makepad-2.0-troubleshooting — Claude Code skill for Makepad 2.0 errors

A skill that walks through the usual Makepad 2.0 and Splash failures: layouts that never appear, text hidden behind a background, broken overrides. Useful when the UI compiles but looks wrong.

Install into Claude Code · Skills CLI (Vercel) All methods and platforms ↓
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-troubleshooting -a claude-code
Open on GitHub

What makepad-2.0-troubleshooting does

Each entry follows the same shape: the symptom you see, the cause underneath, and the corrected code. First up is a container that resolves to zero height and hides everything inside it, plus text that stays invisible on a coloured background because of how draw calls are batched.

Splash specifics get their own write-ups. Named children use :=, static ones use : — mix them up and an override is dropped without a warning. Hex colours containing the letter e need the #x prefix, or the parser reads the digits as an exponent. border_radius wants a single f32, not an Inset. There is a catch with naming, too: a child deeper in the tree stays out of reach if any wrapper above it has no name, so Item{label.text: …} does nothing until every level on the path is labelled.

The skill points at two reference docs, AGENTS.md and splash.md. The height: Fit advice has an exception: under a parent with a fixed height, Fill is the right call.

What it helps with

  • trace why a container collapsed to zero height
  • make text visible again on a filled background
  • fix a property override that is silently ignored
  • get past a parse error on a hex colour with e
  • set corner radius without breaking the layout

Example prompts for the agent

  • My Makepad screen shows nothing at all — find where the height went to zero
  • The label on my RoundedView is invisible even with draw_text.color set. What is batching doing here?
  • Overriding title.text on the Card template has no effect; the default still shows

How to install makepad-2.0-troubleshooting

1Skills CLI (Vercel)

npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-troubleshooting -a claude-code

2Manually: put the files in place

~/.claude/skills/makepad-2.0-troubleshooting/SKILL.md

Copy the whole skill folder; for one project use .claude/skills/makepad-2.0-troubleshooting/

Step by step, with commands for each platform: How to install skills in Claude Code: five ways

Questions about makepad-2.0-troubleshooting

How do I install makepad-2.0-troubleshooting in Claude Code?

Run npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-troubleshooting -a claude-code. The skill lands at ~/.claude/skills/makepad-2.0-troubleshooting/SKILL.md.

What does makepad-2.0-troubleshooting do?

It catalogues frequent Makepad 2.0 and Splash mistakes as symptom, cause and fix, so the agent proposes a working correction instead of guessing at your code.

Why is my child property override ignored?

Check the declaration. A child created with : is static and cannot be addressed, while := makes it named — and every container between the root and that child has to be named as well.

Similar skills

All skills for Frontend and UI →

From the same set6

Project sponsors

Companies that keep this analytics open
Gold sponsor

Impressions, clicks and code copies — open statistics. We keep the numbers public for the same reason NeBlask itself is public. Become a sponsor