Borrowing it
Nothing to install: this file belongs to Coinyak/onchainai. Take a copy, put it at the same path in your own repository, and replace the rules that are about this project with yours.
curl -O https://raw.githubusercontent.com/Coinyak/onchainai/main/.agents/skills/onchainai-ui-workflow/SKILL.mdgit clone --depth 1 https://github.com/Coinyak/onchainaiWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/coinyak/onchainai/onchainai-ui-workflow)<a href="https://agentmods.dev/skills/coinyak/onchainai/onchainai-ui-workflow"><img src="https://agentmods.dev/badge/skills/coinyak/onchainai/onchainai-ui-workflow/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/coinyak/onchainai/onchainai-ui-workflow"><img src="https://agentmods.dev/badge/skills/coinyak/onchainai/onchainai-ui-workflow.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00060 | $0.01220 |
| Opus 5 | $0.00030 | $0.00610 |
| Sonnet 5 | $0.00012 | $0.00244 |
| Haiku 4.5 | $0.00006 | $0.00122 |
Grade A, and why
onchainai-ui-workflow scanned grade A with 1 finding against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 10d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Makes network callslowCapability
Not a fault in itself. Listed so you know the mod talks to something, and to what.
This is the preferred agent path because it does a coherent API + Next.js release build, restarts both servers, verifies bundle timestamps, runs curl/browser/auth smoke, and captures desktop/mobile screenshots. How it starts
The opening of the file, as written. The whole thing — 137 lines — stays where its author put it; the contents beside it link to each section on GitHub.
OnchainAI UI Workflow
Use this repo-specific workflow for UI work before reaching for generic frontend advice. OnchainAI already has strong design and deploy rules; the job is to preserve them while making small, visible improvements.
Source Priority
Read these first for any UI change:
AGENTS.mdDESIGN.mddocs/UI_UX_DESIGN.mddocs/BUILD_DEPLOY_RULES.md
Then inspect the affected frontend/ component, page, CSS, and script files. Do not infer UI intent from screenshots alone when a design doc covers the surface.
Design Invariants
- UI text is English.
- No emoji in UI text.
- Use lucide-style SVG line icons or existing icon/logo patterns.
- Keep the calm light theme: neutral surfaces, orange only for primary interaction/focus, no crypto-gradient styling.
- Preserve information density without cramped mobile layouts.
- Body text on mobile must stay readable; touch targets should be at least 44px.
- Cards stay at 8px radius or less unless the existing design document says otherwise.
- Do not introduce x402 payment execution, custody, wallet, facilitator, or fund-moving UI. x402 belongs to metadata, attribution, and trust signals only.
Workflow
0. Preserve Existing Behavior
Before editing, identify the existing behavior that must survive the change:
- Navigation and auth controls.
- Sidebar collapse/expand behavior and saved state.
- Search, filters, sorting, pagination/load more, and selected tool behavior.
- Modal open/close, keyboard dismissal, and focusable controls.
- Existing
data-testidselectors used by smoke scripts.
Do not remove or rename these behaviors as part of a visual fix unless the user explicitly asks and the smoke scripts/docs are updated.
1. Frame The Change
Write down:
- Target route or component.
- User task it supports.
- Viewports that matter, usually
1280x900and375x812. - Whether this is a layout, responsive, accessibility, component-boundary, or visual-polish issue.
If the issue is vague, use web-design-guidelines or visual-qa after capturing screenshots.
What ships with it
1 file beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 10d ago First seen · 137 lines · 60 tokens per session scan A d920527aee73
onchainai-ui-workflow is a skill published in the GitHub repository Coinyak/onchainai (1 stars, last pushed 1mo ago), licensed MIT. It adds 60 tokens to every session and 1,220 once invoked, about $0.0003 per session on Opus 5. A static security scan graded it A with 1 finding (makes network calls). No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other skills, from other repositories
kiranism-shadcn-dashboard
Guide for building features, pages, tables, forms, themes, and navigation in this Next.js 16 shadcn dashboard template. Use this skill whenever the user wants to add a new page, create a feature module, build a data table, add a form, configure navigation items, add a theme, set up RBAC access control, or work with…
sandbox
Visual HTML canvas sandbox for agent-driven UI and live previews.
nextjs-shadcn
Creates Next.js frontends with shadcn/ui. Use when building React UIs, components, pages, or applications with shadcn, Tailwind, or modern frontend patterns. Also use when the user asks to create a new Next.js project, add UI components, style pages, or build any web interface — even if they don't mention shadcn…
web-design-direction-system
Resolve shared design intent and guidance.
design
Design workflow that creates design systems, DESIGN.md, and design tokens with anti-pattern enforcement and accessibility checks.
modern-site-engineering
Integrate systems after frontend direction.