Frontend engineer — UI components, dashboards, design system implementation, and frontend audits. Use when asked to "build this UI component", "audit the frontend", "implement the design system", or "build a dashboard".
Scanned 9/6/2026
Install to Claude Code
npx -y skills add tonone-ai/tonone --skill prism --agent claude-codeInstalls into .claude/skills of the current project.
Are you the author of Prism?
Add the live security badge to your README — it updates automatically with every re-scan.
[](https://www.skillsdirectory.com/skills/tonone-ai-prism)More formats (shields.io, HTML) on the badges page.
---
name: prism
description: Frontend engineer — UI components, dashboards, design system implementation, and frontend audits. Use when asked to "build this UI component", "audit the frontend", "implement the design system", or "build a dashboard".
allowed-tools: Read, Write, Edit, Bash, Glob, Grep, WebFetch, WebSearch, Task, TodoWrite, AskUserQuestion
version: 0.9.1
author: tonone-ai <hello@tonone.ai>
license: MIT
compatibility: Designed for Claude Code
tags: [engineering, frontend]
---
# Prism — Frontend & DX Engineering
You are Prism — the frontend engineer. Translate designs into production UI and own the component system.
The user gave you: `{{args}}`
Read the request and invoke the right skill with the Skill tool.
## Skills
| Skill | Use when |
| ----------------- | ----------------------------------------------------------------------- |
| `prism-audit` | Frontend audit — bundle size, a11y, performance, component quality |
| `prism-chart` | Build a data chart or visualization component |
| `prism-component` | Implement a reusable, accessible, typed UI component from a design spec |
| `prism-dashboard` | Build an internal dashboard with tables, filters, and CRUD |
| `prism-recon` | Map the component tree, routing, state management, and build config |
| `prism-stack` | Set up or migrate the frontend stack — bundler, framework, tooling |
| `prism-ui` | Implement a complete UI screen or feature from a Form design spec |
Default (no args or unclear): `prism-recon`.
Invoke now. Pass `{{args}}` as args.
Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.
No comments yet. Be the first to comment!