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.
Shape intended product behavior in Lamina's transactional graph when explicitly invoked as lamina-design or when passive implementation preparation reports design gaps.
The automated check flagged lines worth reading first. See the safety section below.
$ npx skills add aryaniyaps/lamina --skill lamina-design -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install aryaniyaps/lamina lamina-design --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/aryaniyaps/lamina.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/lamina-design .claude/skills/lamina-design && 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 "lamina-design" agent skill from https://github.com/aryaniyaps/lamina/tree/main/skills/lamina-design into .claude/skills/lamina-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "lamina-design", 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/aryaniyaps/lamina/tree/main/skills/lamina-designType 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 aryaniyaps/lamina --skill lamina-design -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install aryaniyaps/lamina lamina-design --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/aryaniyaps/lamina.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skills/lamina-design .agents/skills/lamina-design && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "lamina-design" agent skill from https://github.com/aryaniyaps/lamina/tree/main/skills/lamina-design into .agents/skills/lamina-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "lamina-design", 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 aryaniyaps/lamina --skill lamina-design -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install aryaniyaps/lamina lamina-design --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/aryaniyaps/lamina.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skills/lamina-design .cursor/skills/lamina-design && 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 "lamina-design" agent skill from https://github.com/aryaniyaps/lamina/tree/main/skills/lamina-design into .cursor/skills/lamina-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "lamina-design", 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/aryaniyaps/lamina.git --path skills/lamina-design--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 aryaniyaps/lamina --skill lamina-design -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install aryaniyaps/lamina lamina-design --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/aryaniyaps/lamina.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skills/lamina-design .gemini/skills/lamina-design && 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 "lamina-design" agent skill from https://github.com/aryaniyaps/lamina/tree/main/skills/lamina-design into .gemini/skills/lamina-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "lamina-design", 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 aryaniyaps/lamina lamina-designInstalls 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 aryaniyaps/lamina --skill lamina-design -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/aryaniyaps/lamina.git skills-src && mkdir -p .github/skills && cp -r skills-src/skills/lamina-design .github/skills/lamina-design && 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 "lamina-design" agent skill from https://github.com/aryaniyaps/lamina/tree/main/skills/lamina-design into .github/skills/lamina-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "lamina-design", 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 aryaniyaps/lamina --skill lamina-design -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install aryaniyaps/lamina lamina-design --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/aryaniyaps/lamina.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skills/lamina-design .opencode/skills/lamina-design && 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 "lamina-design" agent skill from https://github.com/aryaniyaps/lamina/tree/main/skills/lamina-design into .opencode/skills/lamina-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "lamina-design", 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.
lamina-designShape intended product behavior in Lamina's transactional graph when explicitly invoked as lamina-design or when passive implementation preparation reports design gaps.
Lamina Design is an agent skill from aryaniyaps/lamina. Shape intended product behavior in Lamina's transactional graph when explicitly invoked as lamina-design or when passive implementation preparation reports design gaps. Publish an implementation-ready graph version without editing application source.
Its SKILL.md is about 2k 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: Headless product design for AI coding agents, backed by a transactional product graph | Design how it works, verify what you ship. The licence is Apache-2.0.
12 steps, taken from the first numbered list in SKILL.md.
Read from SKILL.md and the folder at commit af269ef. 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.
Lamina Design loads about 2k tokens when it runs. Until then it costs about 66 tokens; SKILL.md has 936 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 patterns that need a careful read before installing.
returns an implementation-ready packet. Do not tell the userAutomated 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 aryaniyaps/lamina at commit af269ef, republished under its Apache-2.0 licence (© aryaniyaps). 936 words, ~1,972 tokens.
.claude/skills/lamina-design/SKILL.md (or your agent's skills folder).Lamina design writes product knowledge through graphd; it never edits application source. Legacy run files are source evidence only and must never be discovered, selected, read, or written by this workflow. A user request to edit a legacy run, bypass graphd, or make a completed run authoritative conflicts with the storage contract: refuse that mechanism and continue any concrete design change transactionally in the graph. Absence of a legacy artifact is not a blocker.
First read and apply
../lamina/orchestrator/prerequisites/cli-required.md. Stop before all
mutations unless the CLI API 1 prerequisite passes.
Require a valid .lamina/business-context.md. If it is missing or incomplete, emit the init-required contract from ../lamina/orchestrator/prompts/outputs/init-blocked.md and stop. Business documents and .lamina/personas.json may be indexed as observations, but neither is canonical graph state.
If the brief lacks users, outcome, or scope and the user did not authorize labeled assumptions, emit the clarification contract from ../lamina/orchestrator/prompts/outputs/clarify.md and stop before mutations.
Read ../lamina/orchestrator/load-protocol.md, ../lamina/orchestrator/references/product-graph.md, ../lamina/orchestrator/workflows/design.md, ../lamina/orchestrator/prerequisites/cli-required.md, ../lamina/orchestrator/prerequisites/init-required.md, and ../lamina/orchestrator/audit-profiles.yaml. Load experience-core.always, then only the experience-core.conditional entries whose when signal appears in the active Workflow closure. For each entry, open the named capability SKILL.md and then its exact reference; do not load sibling topics.
lamina graph status and lamina graph query --at HEAD to resolve the source revision and active graph.lamina design prepare-walk --workflow <workflow> --persona <persona> --request-file <request> --output <task.json>. Give that exact task to one independent subagent when the
provider supports subagents; otherwise use a separate isolated context.
Walkers receive no other Persona's conclusions.lamina design record-walk --task <task.json> --result <result.json>. The result must be
lamina.persona-walk/v1, name its isolation context, and remain
source-read-only. graphd publishes it as engine-owned simulated evidence.lamina session start. Propose
stable opaque Resources and normalized Statements with lamina graph propose ... --session <id>, patch --session <id>, or link --session <id>.
Agents must not set epistemic class, approval, or raw Cypher.experience-core entries.
Do not treat conditional trust, time, concurrency, or accessibility topics
as automatic unless their profile signal is present. Do not author a
second Experience Contract Decision: graphd compiles Persona-bound
Experience Cases directly from the current walks. A walk is current only
when its digest covers the exact Resources and Statements in the Workflow
closure. Inapplicable dimensions need a product rationale; they may not be
omitted.lamina graph validate --at <session-id>. Resolve shape, reachability, authority, dependency, proof, Persona-walk, and evidence failures. Relevant Contradictions mean approved: false.lamina mission compile --workflow <workflow-id> --session <session-id>.
If asked to rank, prune, retain a top N, or apply a persona cap, explicitly reject the cap and keep all active Personas.lamina session publish <session-id>. If compare-and-swap fails, run lamina session rebase <session-id>, re-query and revalidate, then publish.lamina work prepare and continue
only when it returns an implementation-ready packet. Do not tell the user
to invoke this skill.Single mutations may use implicit one-shot sessions through lamina graph propose, patch, or link. A multi-fact design must use one explicit session so it commits completely or leaves the branch unchanged.
Report the resolved GraphVersion and source revision, then:
### Domain and invariants
### Actors and permissions
### Workflows
### Scenarios
### Implementation projection
### Contradictions and open questionsReport each Persona walk separately before the union: nodes traversed,
permission decisions, discovered branches, states, edge axes, Scenarios,
Invariants, and unresolved conflicts. Then report the expanded canonical
graph and Persona-bound deterministic Experience Cases. If asked to implement
app code in the same ordinary request, continue through WorkMap and
implementation after the graph transaction; only an explicit graph-only
/lamina-design invocation ends before source edits.
.lamina/runs/**.© aryaniyaps, 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
Just SKILL.md in skills/lamina-design of aryaniyaps/lamina.
Open the folder on GitHubat commit af269ef
Lamina Design 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 |
|---|---|---|---|---|---|---|
| Lamina Design this skillaryaniyaps/lamina | 116 | — | ~2k | Automated safety check: Warn | Apache-2.0 | |
| Web Artifacts Builderanthropics/skills | 180k | 40 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 | 26 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 | 97 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.
aryaniyaps/lamina
Define authoritative runtime product truth across actors and views.
aryaniyaps/lamina
Frame product problems and decide what to build. An agent skill from aryaniyaps/lamina.
aryaniyaps/lamina
Plan and synthesize evidence-grounded product research. An agent skill from aryaniyaps/lamina.
aryaniyaps/lamina
Reason about causal product systems and change over time. An agent skill from aryaniyaps/lamina.
aryaniyaps/lamina
Design understandable and accessible product interactions. An agent skill from aryaniyaps/lamina.
aryaniyaps/lamina
Judge product usability and evidence quality. An agent skill from aryaniyaps/lamina.
Categories
Shape intended product behavior in Lamina's transactional graph when explicitly invoked as lamina-design or when passive implementation preparation reports design gaps. Lamina Design is an agent skill from aryaniyaps/lamina. Shape intended product behavior in Lamina's transactional graph when explicitly invoked as lamina-design or when passive implementation preparation reports design gaps.
Lamina Design fits situations like: frontend & Design work in your project.
Run `npx skills add aryaniyaps/lamina --skill lamina-design -a claude-code`. Or copy the skill folder (skills/lamina-design in aryaniyaps/lamina) into .claude/skills/lamina-design in your project. Claude Code loads it when a task matches its description.
Run `npx skills add aryaniyaps/lamina --skill lamina-design -a codex`. Or copy the skill folder (skills/lamina-design in aryaniyaps/lamina) into .agents/skills/lamina-design 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 aryaniyaps/lamina --skill lamina-design -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/lamina-design, .gemini/skills/lamina-design, .github/skills/lamina-design and .opencode/skills/lamina-design in your project.
SKILL.md names no scripts, command-line tools or credentials: Lamina Design 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 flagged 1 warning(s): contains instruction-override wording (e.g. “without asking the user”). Read the flagged lines before installing; the check is not a guarantee either way.
Lamina Design 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 2k tokens (SKILL.md is roughly 7.9k 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 Lamina Design: 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.
aryaniyaps (a GitHub user) maintains it in aryaniyaps/lamina, which has 116 GitHub stars. The repository holds 10 skills in this directory. The repository was last updated on October 1, 2026.
Source: aryaniyaps/lamina on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.