Stats
Actions
Tags
From mossnotes.app for Claude Code
Creates self-contained HTML previews, interactive prototypes, and behavior demos in Moss notes. Use for clickable controls, forms, animated states, and high-fidelity UI rendering.
How this skill is triggered — by the user, by Claude, or both
Slash command
/moss-skills:moss-htmlThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Use `moss-html` when the artifact needs browser behavior or high-fidelity UI rendering: clickable controls, tabs, filters, menus, forms, animated states, realistic spacing/styling, or a small prototype that demonstrates how an interaction should work. Do not use HTML for plain prose, tables, simple diagrams, static screenshots, or rough spatial thinking; use semantic markdown, charts, callouts,...
Use moss-html when the artifact needs browser behavior or high-fidelity UI rendering: clickable controls, tabs, filters, menus, forms, animated states, realistic spacing/styling, or a small prototype that demonstrates how an interaction should work. Do not use HTML for plain prose, tables, simple diagrams, static screenshots, or rough spatial thinking; use semantic markdown, charts, callouts, Canvas, or images for those instead. For rough wireframes, flows, and spatial diagrams, use the Canvas node with the canonical moss-canvas fence.
Embed HTML directly in the note:
```moss-html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="moss-html-version" content="v1">
<style>
* { box-sizing: border-box; }
html { background: rgb(253 250 246); }
body {
width: 1200px;
min-height: 900px;
margin: 0;
padding: 40px;
background: rgb(253 250 246);
color: rgb(72 67 60);
font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
</style>
</head>
<body>
<!-- HTML preview or prototype content -->
</body>
</html>
```
Rules:
moss-html fence line; do not add dimensions to the fence.localStorage, sessionStorage, cookies, same-origin fetches, parent/window APIs, or Moss internals.body or html with width and height or min-height; Moss uses that footprint for the static PNG preview, defaulting to 1200x900 if omitted.DOMContentLoaded.divs.<meta name="moss-html-version" content="v1"> as the canonical Moss document marker. Moss may auto-wrap fragments and canonicalize the shell/head metadata on save; you own visible body content and any extra CSS/JS.npx claudepluginhub brsbl/moss-skills --plugin moss-skillsFetches up-to-date documentation from Context7 for libraries and frameworks like React, Next.js, Prisma. Use for setup questions, API references, and code examples.
Applies a firm's KYC/AML rules grid to parsed onboarding records: assigns risk rating, checks required documents, outputs rule outcomes with citations, and routes for escalation.
Generates daily or weekly digests of activity from connected sources (chat, email, docs, tasks, CRM), highlighting action items, decisions, mentions, and project updates.