Point your agent at a card, dialog or other component and get a one-page technical drawing of it, like Apple's accessory drawings: plan view, exploded layers, detail circles and tables of paddings, gaps and radii. A second skill animates the sheet drawing itself.
In short: Point your agent at a card, dialog or other component and get a one-page technical drawing of it, like Apple's accessory drawings: plan view, exploded layers, detail circles and tables of paddings, gaps and radii. A second skill animates the sheet drawing itself. It is a free skill for people who use Claude Code, Codex, Cursor or Claude and want help with coding agent skills.
Checked on · Added
| Agent / tool | Access / cost | Link |
|---|---|---|
| Claude Code | Paid Claude plan or API | claude.com/claude-code |
| Codex | ChatGPT plan or API | openai.com/codex |
| Cursor | Free tier + paid | cursor.com |
| Claude | Free tier + paid | claude.ai |
| GitHub repo | Open source · ★ 1.5k | enesozturk/dimensional-drawing |
Image: from the GitHub README, shown with credit.
Images from the project README on GitHub.
Real videos made with this skill, credited to their creators. Hover to preview.
APP DEMO0:11The author's 11-second demo of dimensional-drawing: the sheet draws itself line by line, starting on the header close-up, pulling back to the plan view, lifting the layers into an exploded view and ending on the full page of measurements.
MOTION0:13A 13-second film a user made with dimensional-drawing: a concept foldable iPhone appears as clean line drawings with front, side, top and exploded views, measurements and labels building up one by one.
npx skills add enesozturk/dimensional-drawing git clone https://github.com/enesozturk/dimensional-drawing cp -r dimensional-drawing/skills/* ~/.claude/skills/
Install command copied from the project README. Check the README for the latest version.
Point your agent at a card, dialog or other component and get a one-page technical drawing of it, like Apple's accessory drawings: plan view, exploded layers, detail circles and tables of paddings, gaps and radii. A second skill animates the sheet drawing itself.
dimensional-drawing teaches your agent to document a card, dialog or any other component as a spec sheet: plan view, exploded layers, close-up detail circles and tables of paddings, gaps, corner radii and layers, all in…
Short excerpt from the README of enesozturk/dimensional-drawing. Read the full README on GitHub.
From the original post, credited below.
Documents structure, not content: text and branding are left out on purpose, and unknown values stay marked TBD. The animation was tuned for Claude's Motion artifact; other animation libraries are not tested. Young repo with few commits so far.
Point your agent at a card, dialog or other component and get a one-page technical drawing of it, like Apple's accessory drawings: plan view, exploded layers, detail circles and tables of paddings, gaps and radii. A second skill animates the sheet drawing itself.
It works with Claude Code, Codex, Cursor and Claude. The code is on GitHub at enesozturk/dimensional-drawing.
Free & open source (MIT). The motion skill targets Claude's Motion artifact; the headless renderer needs Node 18+, Playwright and ffmpeg.
Run the install command from the README: “npx skills add enesozturk/dimensional-drawing”. Check the README on GitHub for the latest version, then follow the steps on this page.
We read 8 instruction and code files in the repo and found no red flags. That is not a guarantee, so review anything that runs commands on your machine.
All credit to the original authors. We rewrite in our own words and link back. Something wrong? Report it.
SKILLYour coding agent connects to an Android or Google TV over Wi-Fi, switches off the ad and tracking apps, and puts in a clean, Apple TV-style home screen. Nothing is uninstalled.
Claude Code +2★ 14.8k
SKILLA Claude skill that reviews a vibecoded screen like a designer: it lists the tell-tale AI touches, proposes a direction from your own product, then fixes spacing, colour, icons, copy, type and layout pass by pass. Works on dashboards, apps, landing pages, or a live site from a link.
Claude Code★ 540
SKILLOne install gives your agent a plan, test, build, review and remember routine, with 71 helper agents, about 300 skills, memory between sessions and a built-in scanner for risky agent settings.
Claude Code +3★ 285.3k
SKILLA skills framework that makes agents brainstorm, plan, test and debug systematically.
Claude Code +1★ 299.2k
SKILLReal engineering skills from a well-known TypeScript educator's own .agents folder.
Claude Code +1★ 291.4k
SKILLA skill that pushes coding agents to act like a lazy senior: fewer lines, more tests, lower cost — without skipping the hard checks.
Claude Code +2★ 164.8kFree newsletter
New AI tools you can use right away, in plain words. Every Friday.
