Figma use_figma Plugin API Rules
warpdotdev/warp
Required groundwork before any use_figma call: the rules and reference files for running JavaScript in a Figma file through the Plugin API without common failures.
Apply the principle of Wabi-Sabi — the aesthetic embrace of imperfection, impermanence, and naturalness.
$ npx skills add hashgraph-online/awesome-codex-plugins --skill wabi-sabi -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install hashgraph-online/awesome-codex-plugins wabi-sabi --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/hashgraph-online/awesome-codex-plugins.git skills-src && mkdir -p .claude/skills && cp -r skills-src/plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi .claude/skills/wabi-sabi && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "wabi-sabi" agent skill from https://github.com/hashgraph-online/awesome-codex-plugins/tree/main/plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi into .claude/skills/wabi-sabi/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "wabi-sabi", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/hashgraph-online/awesome-codex-plugins/tree/main/plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabiType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add hashgraph-online/awesome-codex-plugins --skill wabi-sabi -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install hashgraph-online/awesome-codex-plugins wabi-sabi --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/hashgraph-online/awesome-codex-plugins.git skills-src && mkdir -p .agents/skills && cp -r skills-src/plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi .agents/skills/wabi-sabi && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "wabi-sabi" agent skill from https://github.com/hashgraph-online/awesome-codex-plugins/tree/main/plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi into .agents/skills/wabi-sabi/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "wabi-sabi", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add hashgraph-online/awesome-codex-plugins --skill wabi-sabi -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install hashgraph-online/awesome-codex-plugins wabi-sabi --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/hashgraph-online/awesome-codex-plugins.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi .cursor/skills/wabi-sabi && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "wabi-sabi" agent skill from https://github.com/hashgraph-online/awesome-codex-plugins/tree/main/plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi into .cursor/skills/wabi-sabi/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "wabi-sabi", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/hashgraph-online/awesome-codex-plugins.git --path plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add hashgraph-online/awesome-codex-plugins --skill wabi-sabi -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install hashgraph-online/awesome-codex-plugins wabi-sabi --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/hashgraph-online/awesome-codex-plugins.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi .gemini/skills/wabi-sabi && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "wabi-sabi" agent skill from https://github.com/hashgraph-online/awesome-codex-plugins/tree/main/plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi into .gemini/skills/wabi-sabi/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "wabi-sabi", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install hashgraph-online/awesome-codex-plugins wabi-sabiInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add hashgraph-online/awesome-codex-plugins --skill wabi-sabi -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/hashgraph-online/awesome-codex-plugins.git skills-src && mkdir -p .github/skills && cp -r skills-src/plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi .github/skills/wabi-sabi && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "wabi-sabi" agent skill from https://github.com/hashgraph-online/awesome-codex-plugins/tree/main/plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi into .github/skills/wabi-sabi/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "wabi-sabi", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add hashgraph-online/awesome-codex-plugins --skill wabi-sabi -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install hashgraph-online/awesome-codex-plugins wabi-sabi --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/hashgraph-online/awesome-codex-plugins.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi .opencode/skills/wabi-sabi && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "wabi-sabi" agent skill from https://github.com/hashgraph-online/awesome-codex-plugins/tree/main/plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi into .opencode/skills/wabi-sabi/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "wabi-sabi", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
wabi-sabiApply the principle of Wabi-Sabi — the aesthetic embrace of imperfection, impermanence, and naturalness.
Wabi Sabi is an agent skill from hashgraph-online/awesome-codex-plugins. Apply the principle of Wabi-Sabi — the aesthetic embrace of imperfection, impermanence, and naturalness. Use when designing for warmth and authenticity, creating spaces that feel lived-in rather than sterile, choosing handcrafted-feeling materials over machined perfection, or evaluating whether a design feels too polished and impersonal. Wabi-sabi resists the digital-design tendency toward pixel-perfect uniformity in favor of subtle asymmetry, organic textures, and the visible mark of process. Used appropriately…
Its SKILL.md is about 2.6k tokens, which your agent loads only when the skill is triggered. The skill folder holds 2 other files, including reference files (for example `references/lineage.md`).
It sits in Frontend & Design, covering Design to code. The repository describes itself as: A curated list of awesome OpenAI Codex / ChatGPT plugins, skills, and resources. The 1 Codex Marketplace. See live plugins at: https://hol.org/plugins/best-codex-plugins. The licence is Apache-2.0.
Read from SKILL.md and the folder at commit 3e1456a. It shows what the files ask for, not the result of running them.
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
No scripts in the folder and no shell commands in SKILL.md.
From the folder's file list and the shell code blocks in SKILL.md.
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Wabi Sabi loads about 2.6k tokens when it runs, and up to ~4.4k if it reads all its reference files. Until then it costs about 155 tokens; SKILL.md has 1,259 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
The full file from hashgraph-online/awesome-codex-plugins at commit 3e1456a, republished under its Apache-2.0 licence (© hashgraph-online). 1,259 words, ~2,603 tokens.
.claude/skills/wabi-sabi/SKILL.md (or your agent's skills folder). This skill also uses 1 other file; get the full folder from GitHub.Definition. Wabi-sabi is a Japanese aesthetic philosophy centered on the beauty of imperfection, impermanence, and naturalness. Wabi connotes simplicity, rustic refinement, and the elegance of restraint; sabi connotes the patina of age, the beauty of weathering, and the marks of use. Together they describe an aesthetic that finds beauty in the asymmetric, the irregular, the modest, the worn — qualities the dominant Western aesthetic of perfection, symmetry, and uniformity often rejects.
In design, wabi-sabi serves as a counterweight to the relentless polish of modern digital aesthetics. Pixel-perfect grids, algorithmic uniformity, smoothed gradients, machine precision — all produce designs that can feel sterile, impersonal, untouched by human hand. Wabi-sabi asks: is the perfect actually best? Or does some imperfection produce a warmth that perfection lacks?
The principle isn't included in the 2003 first edition of Universal Principles of Design but appears in expanded editions, where it's positioned as a useful antidote to the over-perfect tendencies of computer-aided design. It's most useful in modern UX as a counterbalance to the homogenization of design systems.
Most design tools and processes push toward perfection by default. Auto-aligned grids, snapped-to-pixel layouts, mathematically-derived color palettes, perfectly consistent components. The result is technically excellent and emotionally cold. Many products from the 2010s onward have a sameness about them — competently designed, almost interchangeable, lacking warmth.
Wabi-sabi reintroduces humanity. Subtle asymmetry. Texture that suggests material, not just rendering. Hand-drawn elements among the geometric. Imperfections that read as authentic rather than broken. The result, when done well, is design that feels made for humans by humans.
Used appropriately, wabi-sabi:
Used inappropriately, wabi-sabi:
Some product categories naturally welcome wabi-sabi:
Personal / intimate products. Journals, notes apps, meditation tools, personal finance — products users engage with reflectively. Subtle warmth supports the personal register.
Creative tools. Drawing apps, music production, writing tools — products that make things. Some imperfection acknowledges that creation is a messy process.
Cultural / artisanal products. Bookstores, craft marketplaces, slow-food platforms — products whose subject matter is itself wabi-sabi-aligned.
Editorial content. Magazines, blogs, newsletters — long-form content that benefits from typographic warmth and varied rhythm rather than uniform grids.
Brand differentiation moments. Marketing surfaces, hero illustrations, special-occasion designs — places where standing out matters.
Some contexts demand precision and reject imperfection:
Critical-action interfaces. Medical, financial, safety-critical UI. Users need to be sure of what they're seeing; imperfection undermines that.
Data-dense displays. Spreadsheets, dashboards, analytical tools. Users need to scan and compare; asymmetry hurts.
High-volume UI. The settings panel, the form, the table. Functional elements that benefit from systematic consistency.
Enterprise / institutional contexts. B2B SaaS, government, compliance tools. The audience expects precision; informal imperfection reads as unprofessional.
Accessibility-critical contexts. Asymmetric or irregular elements can hurt users with vision differences or cognitive disabilities.
The principle is selective. Apply where warmth helps; restrain where precision matters.
A meditation app uses subtle wabi-sabi cues: a slightly-imperfect hand-drawn logo (rather than a precision-vector logo), illustrations with visible brushstrokes, soft asymmetric backgrounds suggesting watercolor. The chrome is otherwise clean and functional.
The result feels personal and reflective — appropriate for the product's purpose. A perfectly-precise design would feel cold for this category.
A note-taking app uses wabi-sabi restraint: minimal chrome, generous whitespace, a serif typeface with humanist warmth, gentle separators rather than hard borders. The interface gets out of the way; the user's content is the focal point.
The restraint here is wabi-sabi at the absence-of-decoration level. The app feels modest and refined.
A B2B analytics tool's marketing site uses hand-drawn illustrations, slightly tilted cards, and informal typography. The marketing reads as casual and friendly. But the product itself — used by enterprise buyers for serious analysis — feels at odds with the marketing's register. Buyers expect precision; the wabi-sabi feels mismatched.
The fix: keep the marketing warm if it serves brand differentiation, but ensure the product itself reads as precise and trustworthy. Or align both registers — but probably toward the precision side, given the audience.
A personal finance product uses wabi-sabi cues throughout: warm typography, slight irregularities in card layouts, hand-illustrated charts. The intent is to feel personal and approachable.
But: the audience needs to trust the numbers. Slight asymmetry in chart layout can read as data unreliability. The wabi-sabi register may be undermining the product's core promise.
The fix: keep wabi-sabi in non-data surfaces (onboarding, marketing, brand moments) and apply precision in data displays. Use the right register for each context within the same product.
An online bookstore uses wabi-sabi extensively: slightly tilted book covers, organic textures suggesting paper and ink, varied rhythm rather than rigid grids, hand-set typography with intentional kerning irregularities. The product (books, reading) is itself wabi-sabi-aligned, so the design echoes it.
The result feels like a real bookstore — handcrafted, curated, personal. A precision-design would feel more like a generic e-commerce site.
Wabi-sabi as decoration. Adding imperfection without purpose. Tilted cards because "it looks designed," not because the design needs them.
Confusing imperfection with sloppy. True wabi-sabi imperfection is deliberate and refined. Sloppy work is broken and unfinished. The two are not the same.
Wabi-sabi at scale. Hand-crafted elements that work in a small studio don't scale to global design systems. Either commit to the maintenance or use the principle selectively.
Wabi-sabi in the wrong register. Applying the aesthetic to enterprise, financial, medical, or other precision-required contexts.
Wabi-sabi without restraint. Imperfection plus richness equals chaos. Wabi-sabi lives alongside restraint; combining it with maximalism produces visual noise.
Cultural appropriation issues. Using wabi-sabi as a stylistic veneer without engaging with its philosophical roots. The aesthetic comes from a specific cultural tradition; surface adoption can read as shallow.
When considering wabi-sabi cues, ask: Does my product's category and audience welcome warmth? If not, restrain. Is the imperfection deliberate and refined, or just sloppy? Sloppy doesn't help. Does the imperfection hurt accessibility or scanability? If yes, reconsider. Will this scale? Hand-crafted elements have maintenance costs. Am I using wabi-sabi to differentiate, or just for decoration? Decoration without purpose adds nothing.
references/lineage.md — origins in Japanese aesthetic philosophy.wabi-sabi-imperfection/ — sub-skill on designing deliberate imperfection.wabi-sabi-restraint/ — sub-skill on the absence of decoration.© hashgraph-online, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
SKILL.md and 1 other file (references) in plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi of hashgraph-online/awesome-codex-plugins.
Open the folder on GitHubat commit 3e1456a
Wabi Sabi next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Wabi Sabi this skillhashgraph-online/awesome-codex-plugins | 1.3k | — | ~2.6k | Automated safety check: Pass | Apache-2.0 | |
| Figma use_figma Plugin API Ruleswarpdotdev/warp | 65k | 4 repos | ~4.4k | Automated safety check: Pass | AGPL-3.0 | |
| Figma Design to Codewarpdotdev/warp | 65k | 4 repos | ~2.9k | Automated safety check: Pass | AGPL-3.0 | |
| Scalar Design Systemscalar/scalar | 16k | — | ~2.7k | Automated safety check: Pass | MIT | |
| Figma Design System Rules Generatorwarpdotdev/warp | 65k | 3 repos | ~4.6k | Automated safety check: Pass | AGPL-3.0 | |
| Figma Code Connect Componentswarpdotdev/warp | 65k | 2 repos | ~4.2k | Automated safety check: Pass | AGPL-3.0 |
warpdotdev/warp
Required groundwork before any use_figma call: the rules and reference files for running JavaScript in a Figma file through the Plugin API without common failures.
warpdotdev/warp
Turns a Figma frame or component into production code that matches the design, using the Figma MCP server and the project's own design system.
scalar/scalar
Scalar's design system — design tokens, theming (@scalar/themes), CSS variables, and the @scalar/components library.
warpdotdev/warp
Creates project-specific design system rules from your codebase so coding agents implement Figma designs with your components, naming and tokens.
warpdotdev/warp
Maps published Figma components to their code implementations with Code Connect, using the Figma MCP suggestion and mapping tools.
MigoXLab/coderio
Pixel-perfect Figma to React conversion using coderio. An agent skill from MigoXLab/coderio.
hashgraph-online/awesome-codex-plugins
Create original anime-style reaction stickers as looping GIFs and MP4 previews, using generated character pose sheets and timed key poses.
hashgraph-online/awesome-codex-plugins
Manage and query Calibre libraries with the calibredb CLI (local paths or Calibre Content server URLs).
hashgraph-online/awesome-codex-plugins
A skill your agent uses when adding, changing, testing, or debugging Rust HTTP APIs and services, especially when Codex needs black-box integration tests, random-port app startup, real database test…
hashgraph-online/awesome-codex-plugins
Make a studio's game look like something at build time — a cover from a real frame of the game (free), painted covers, backdrops, textures and character plates from image models through the…
hashgraph-online/awesome-codex-plugins
Use CALL-E from Codex through the calle CLI. An agent skill from hashgraph-online/awesome-codex-plugins.
hashgraph-online/awesome-codex-plugins
Balance game difficulty, resources, rewards, probability, progression, economies, and dominant strategies.
Categories
Apply the principle of Wabi-Sabi — the aesthetic embrace of imperfection, impermanence, and naturalness. Wabi Sabi is an agent skill from hashgraph-online/awesome-codex-plugins. Apply the principle of Wabi-Sabi — the aesthetic embrace of imperfection, impermanence, and naturalness.
Wabi Sabi fits situations like: designing for warmth and authenticity; creating spaces that feel lived-in rather than sterile; choosing handcrafted-feeling materials over machined perfection; evaluating whether a design feels too polished and impersonal.
Run `npx skills add hashgraph-online/awesome-codex-plugins --skill wabi-sabi -a claude-code`. Or copy the skill folder (plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi in hashgraph-online/awesome-codex-plugins) into .claude/skills/wabi-sabi in your project. Claude Code loads it when a task matches its description.
Run `npx skills add hashgraph-online/awesome-codex-plugins --skill wabi-sabi -a codex`. Or copy the skill folder (plugins/HDeibler/universal-design-principles/plugins/aesthetics-and-emotion-principles/skills/wabi-sabi in hashgraph-online/awesome-codex-plugins) into .agents/skills/wabi-sabi in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add hashgraph-online/awesome-codex-plugins --skill wabi-sabi -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/wabi-sabi, .gemini/skills/wabi-sabi, .github/skills/wabi-sabi and .opencode/skills/wabi-sabi in your project.
SKILL.md names no scripts, command-line tools or credentials: Wabi Sabi is instructions for the agent only.
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
Wabi Sabi is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
About 2.6k tokens (SKILL.md is roughly 10k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 1.8k tokens, read only when the agent opens those files.
Skills that share tags, products or a category with Wabi Sabi: Figma use_figma Plugin API Rules (warpdotdev/warp, 65k stars), Figma Design to Code (warpdotdev/warp, 65k stars), Scalar Design System (scalar/scalar, 16k stars) and Figma Design System Rules Generator (warpdotdev/warp, 65k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
hashgraph-online (a GitHub organization) maintains it in hashgraph-online/awesome-codex-plugins, which has 1,267 GitHub stars. The repository holds 716 skills in this directory. The repository was last updated on October 10, 2026.
Source: hashgraph-online/awesome-codex-plugins on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.