Web Artifacts Builder
anthropics/skills
Builds multi-component claude.ai HTML artifacts as a small React, TypeScript and Tailwind project, then bundles it into one shareable HTML file.
Record a learned design constraint from a correction into the project brief.
$ npx skills add educlopez/ui-craft --skill remember -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install educlopez/ui-craft remember --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/educlopez/ui-craft.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.codex/skills/remember .claude/skills/remember && 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 "remember" agent skill from https://github.com/educlopez/ui-craft/tree/main/.codex/skills/remember into .claude/skills/remember/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "remember", 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/educlopez/ui-craft/tree/main/.codex/skills/rememberType 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 educlopez/ui-craft --skill remember -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install educlopez/ui-craft remember --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/educlopez/ui-craft.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.codex/skills/remember .agents/skills/remember && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "remember" agent skill from https://github.com/educlopez/ui-craft/tree/main/.codex/skills/remember into .agents/skills/remember/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "remember", 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 educlopez/ui-craft --skill remember -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install educlopez/ui-craft remember --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/educlopez/ui-craft.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.codex/skills/remember .cursor/skills/remember && 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 "remember" agent skill from https://github.com/educlopez/ui-craft/tree/main/.codex/skills/remember into .cursor/skills/remember/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "remember", 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/educlopez/ui-craft.git --path .codex/skills/remember--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 educlopez/ui-craft --skill remember -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install educlopez/ui-craft remember --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/educlopez/ui-craft.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.codex/skills/remember .gemini/skills/remember && 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 "remember" agent skill from https://github.com/educlopez/ui-craft/tree/main/.codex/skills/remember into .gemini/skills/remember/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "remember", 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 educlopez/ui-craft rememberInstalls 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 educlopez/ui-craft --skill remember -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/educlopez/ui-craft.git skills-src && mkdir -p .github/skills && cp -r skills-src/.codex/skills/remember .github/skills/remember && 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 "remember" agent skill from https://github.com/educlopez/ui-craft/tree/main/.codex/skills/remember into .github/skills/remember/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "remember", 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 educlopez/ui-craft --skill remember -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install educlopez/ui-craft remember --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/educlopez/ui-craft.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.codex/skills/remember .opencode/skills/remember && 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 "remember" agent skill from https://github.com/educlopez/ui-craft/tree/main/.codex/skills/remember into .opencode/skills/remember/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "remember", 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.
rememberRecord a learned design constraint from a correction into the project brief.
Remember is an agent skill from educlopez/ui-craft. Record a learned design constraint from a correction into the project brief. Invoke when the user asks for remember on their UI, or mentions 'remember' alongside design / UI / frontend work.
Its SKILL.md is about 590 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.
It sits in Frontend & Design. The repository describes itself as: Design engineering system for AI coding agents — ship UI with craft-level quality. Install as an agent skill. The licence is MIT.
4 steps, taken from the step headings in SKILL.md.
Read from SKILL.md and the folder at commit ceecc8e. 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 (its code samples are markdown).
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.
Remember loads about 585 tokens when it runs. Until then it costs about 50 tokens; SKILL.md has 285 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 educlopez/ui-craft at commit ceecc8e, republished under its MIT licence (© educlopez). 285 words, ~585 tokens.
.claude/skills/remember/SKILL.md (or your agent's skills folder).<!-- HARNESS MIRROR — do not edit here. Canonical source: skills/ or commands/. After editing source, copy into cli/assets/<harness>/ and repo-root harness mirrors. -->
Context: this sub-skill is one lens of the broader ui-craft skill. If the ui-craft skill is also installed, read its SKILL.md first for Discovery + Anti-Slop + Craft Test, then apply the specific lens below.
Load references/brief.md (sections 6 + Self-Correction) before proceeding.
From the argument (or the immediately preceding correction in the conversation), capture:
Append a dated entry to section 6 (Learned constraints) of .ui-craft/brief.md:
- **YYYY-MM-DD** — <the rule>. *Why:* <reason>.Create the brief (run /brief) or the section 6 heading if absent. If the new constraint contradicts an existing principle or constraint, mark the old one deprecated with a dated reason (brief is append-mostly) rather than deleting it. Never store a rule that breaches the accessibility/correctness floor — record the closest compliant interpretation and say so.
If the user signals this should apply to all their projects ("in all my projects", "whenever you work with me"), that's general memory, outside the brief's project scope:
Report in one line where it landed and what it changes, e.g.:
Recorded in the brief (learned constraint): never gradients on a hero here.
Next step: Keep working. The constraint now lives in the brief, so every future session reads it (rung 2).
© educlopez, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Just SKILL.md in .codex/skills/remember of educlopez/ui-craft.
Open the folder on GitHubat commit ceecc8e
Remember 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 |
|---|---|---|---|---|---|---|
| Remember this skilleduclopez/ui-craft | 371 | — | ~585 | Automated safety check: Pass | MIT | |
| Web Artifacts Builderanthropics/skills | 180k | 41 repos | ~769 | Automated safety check: Pass | Apache-2.0 | |
| React Doctormakeplane/plane | 61k | 12 repos | ~657 | Automated safety check: Pass | AGPL-3.0 | |
| Impeccablebestofjs/bestofjs | 3.1k | 27 repos | ~2.6k | Automated safety check: Pass | MIT | |
| Figma Design System Builderwarpdotdev/warp | 65k | 2 repos | ~4.4k | Automated safety check: Pass | AGPL-3.0 | |
| Web Interface Guidelines Reviewervercel-labs/openreview | 1.7k | 98 repos | ~308 | Automated safety check: Pass | None |
anthropics/skills
Builds multi-component claude.ai HTML artifacts as a small React, TypeScript and Tailwind project, then bundles it into one shareable HTML file.
makeplane/plane
Scans React code for lint, accessibility, bundle size and architecture issues, reports a health score and checks that changes do not lower it.
bestofjs/bestofjs
A skill your agent uses when the user wants to design, redesign, shape, critique, audit, polish, clarify, distill, harden, optimize, adapt, animate, colorize, extract, or otherwise improve a…
warpdotdev/warp
Builds or updates a design system in Figma from a codebase in ordered phases: discovery, variables and tokens, components, theming and documentation, with checkpoints.
vercel-labs/openreview
Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my…
anonaddy/anonaddy
Always invoke when the user's message includes 'tailwind' in any form.
educlopez/ui-craft
Pre-ship gate — runs detector, verifies brief and tokens, applies the 10-pass finish bar, ranks findings by feedback hierarchy.
educlopez/ui-craft
File contributor or agent papercuts as GitHub issues labeled friction, or investigate those issues as the daily friction-log Cloud Agent.
educlopez/ui-craft
Full spec-driven pipeline — walks brief → tokens → shape (spec) → craft (build) → converge → ship in one guided run.
educlopez/ui-craft
Front door. An agent skill from educlopez/ui-craft.
educlopez/ui-craft
Audit or establish the project's 3-layer token spine. An agent skill from educlopez/ui-craft.
educlopez/ui-craft
Wireframe-first pass — outputs an ASCII layout + state list + content inventory + question list before any code.
Categories
Record a learned design constraint from a correction into the project brief. Remember is an agent skill from educlopez/ui-craft. Record a learned design constraint from a correction into the project brief.
Remember fits situations like: asks for remember on their UI; mentions remember alongside design / UI / frontend work.
Run `npx skills add educlopez/ui-craft --skill remember -a claude-code`. Or copy the skill folder (.codex/skills/remember in educlopez/ui-craft) into .claude/skills/remember in your project. Claude Code loads it when a task matches its description.
Run `npx skills add educlopez/ui-craft --skill remember -a codex`. Or copy the skill folder (.codex/skills/remember in educlopez/ui-craft) into .agents/skills/remember 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 educlopez/ui-craft --skill remember -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/remember, .gemini/skills/remember, .github/skills/remember and .opencode/skills/remember in your project.
SKILL.md names no scripts, command-line tools or credentials: Remember 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.
Remember is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
About 585 tokens (SKILL.md is roughly 2.3k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
Skills that share tags, products or a category with Remember: Web Artifacts Builder (anthropics/skills, 180k stars), React Doctor (makeplane/plane, 61k stars), Impeccable (bestofjs/bestofjs, 3.1k stars) and Figma Design System Builder (warpdotdev/warp, 65k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
educlopez (a GitHub user) maintains it in educlopez/ui-craft, which has 371 GitHub stars. The repository holds 13 skills in this directory. The repository was last updated on September 3, 2026.
Source: educlopez/ui-craft on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.