HTMLHero.skill SKILL.md skillA

HTMLHero.skill from yishu5/claude-skills is an agent skill: a SKILL.md folder an AI agent loads when a task calls for it.

Install it, pinned
mdr add yishu5/claude-skills/HTMLHero.skill@git:20260920.a199105

Pins git:20260920.a199105 in mdr.lock. Pin the fingerprint instead.

Audit grade
A, 17 of 17 checks passed
Kind
SKILL.md skill
Repository
yishu5/claude-skills
Path
skills/HTMLHero.skill/SKILL.md
Versions recorded
2
Latest version
git:20260920.a199105, committed Sep 20, 2026
First version recorded
Jul 3, 2026
Size
2,919 bytes
Repository stars
132
License
MIT

Build or extend a runnable, responsive Hero first screen for an HTML/React site or web presentation when the user provides a Hero brief, visual reference, media, or existing frontend. Use this for the Hero itself; use HTMLPPT.skill for a multi-slide deck.

Collected from public GitHub. Every version is saved exactly as it was and never changes. Install it at an exact version with the mdr tool, and every file is checked before it reaches your agent. The main file is checked against the SHA-256 fingerprint recorded here, and the others against the fingerprints GitHub keeps for its source commit. The automatic checks below grade the latest version, and the same checks always give the same file the same grade.

What the file says

# HTMLHero.skill

Turn a Hero brief or an existing first-screen implementation into a runnable, reviewable Hero. The first screen should establish a visual system that can be extended later.

## Route

- Use for a new or changed Hero first screen with layout, copy, media, or interaction.
- If the request is a multi-slide HTML presentation, use `HTMLPPT.skill` instead.
- If the request is only visual ideation or copy, do not force an implementation workflow.

## Workflow

1. Establish the finish line and scope. Inspect the target directory, recent `AGENTS.md`, `package.json`, lockfile, relevant entrypoints, and referenced assets. Do not read the whole repository by default.
2. Resolve the smallest useful Hero contract: purpose and audience, required copy, visual references, media, interactions, target viewport, existing stack, and delivery target. Read [references/hero-contract.md](references/hero-contract.md) when inputs are incomplete or the work will be handed off.
…

Read the whole file at its exact version.

How to install

The exact contents, by fingerprint
mdr add yishu5/claude-skills/HTMLHero.skill@sha256:7cf5252aaed5db3a

The line at the top of this page pins the label git:20260920.a199105, which is what most people want. This one pins the sha256 fingerprint of the contents instead, so it survives a label being moved. Either way the exact version is written to mdr.lock, and mdr install downloads and checks those contents again, so it installs them exactly or stops with an error.

Badge

mdr badge

[![mdr](https://markdownregistry.com/badge/art_b6nms5giehogjkqx.svg)](https://markdownregistry.com/a/art_b6nms5giehogjkqx)

4 badge image fetches in 30 days. What the badge shows.

Versions

The registry has recorded 2 versions of this file, between Jul 3, 2026 and Sep 20, 2026, about one every 79 days.

versioncommittedcommitsizeaudit
git:20260920.a199105 latest2026-09-20 a199105 2,919 BA view · diff
git:20260703.29206722026-07-03 2920672 4,703 BA view

Audit of the latest version

A  17 of 17 checks passed. Fixed automatic checks with no AI involved, so the same checks give the same answer every run.
  • pass: Frontmatter block present
  • pass: Frontmatter declares a name
  • pass: Frontmatter declares a description
  • pass: Size between 200 bytes and 200 KB (2919 bytes)
  • pass: No zero-width or bidi control characters
  • pass: No instruction hidden inside an HTML comment
  • pass: No link to an exfiltration or paste host
  • pass: No credential-shaped string
  • pass: No instruction to send local credentials anywhere
  • pass: No text hidden with inline styles
  • pass: No prompt-injection phrasing
  • pass: No curl or wget piped into a shell
  • pass: No recursive delete of root, home or parent
  • pass: No instruction to read or print local credentials
  • pass: No base64 blob over 200 characters
  • pass: No link to a raw IP address
  • pass: No script tag

Source

GitHub

yishu5/claude-skills · 132 stars · license MIT · pushed 2026-10-29 · branch master

API

GET https://markdownregistry.com/api/v1/artifacts/art_b6nms5giehogjkqx
GET https://markdownregistry.com/api/v1/resolve?ref=yishu5/claude-skills/HTMLHero.skill
GET https://markdownregistry.com/api/v1/blob/7cf5252aaed5db3a59dd023daee1422d14276816879595b604e7449960574893

Your AI assistant does the legwork. You hear about the deals worth your word. Hand yours the standing instructions at modelranch.com and it joins the network that reads files like this one.

Guides: the SKILL.md format and its required fields · what to check before you install a skill · how to pin a skill to an exact version · where to find agent skills · keeping a team on the same skills · which agent file does what.

More from yishu5/claude-skills

HTMLPPT.skill SKILL.md skill
yishu5/claude-skills · skills/HTMLPPT.skill/SKILL.md · Build or extend a runnable multi-slide HTML presentation from an existing Hero visual system or frontend project. Use…
git:20260920.a199105 · audit A · 132 stars
clawd-animation-lite SKILL.md skill
yishu5/claude-skills · skills/clawd-animation-lite/SKILL.md · Clawd 像素风动画生成器(轻量版)。根据用户的自然语言描述,生成1-3秒的简短clawd动画,当用户的需求的互动场景较为具体和单一,请采用轻量版本生成token消耗少、生成速度快的HTML像素风动画文件。主角是 Claude Code…
git:20260507.b7f0cc7 · audit B · 132 stars
clawd-animation SKILL.md skill
yishu5/claude-skills · skills/clawd-animation/SKILL.md · Clawd 像素风动画生成器。根据用户的自然语言描述,生成自包含的 HTML 像素风动画文件,主角是 Claude Code 的吉祥物 Clawd(像素风小螃蟹)。当用户提到 clawd、clawd 动画、像素动画、pixel…
git:20260507.b7f0cc7 · audit B · 132 stars
self-improving-agent SKILL.md skill
yishu5/claude-skills · skills/self-improving-agent/SKILL.md · Low-noise self-improvement skill. Captures learnings, errors, and corrections into a local `.learnings/` cache layer…
git:20260316.6f79809 · audit A · 132 stars
vibe-coding-prd SKILL.md skill
yishu5/claude-skills · skills/vibe-coding-prd/SKILL.md · 把需求、原始 PRD、竞品分析、零散笔记或模糊产品想法提炼成可直接发给 Claude Code、Codex 或其他编码 Agent 的精简中文 Markdown PRD。触发:用户说“帮我写一个用来vibe…
git:20260702.5be0cf2 · audit A · 132 stars
vibe-writing SKILL.md skill
yishu5/claude-skills · skills/vibe-writing/SKILL.md · Use when drafting, rewriting, reviewing, or planning Chinese long-form content for public accounts, blogs, newsletters…
git:20260715.7b52dd7 · audit A · 132 stars
wechat-coauthor SKILL.md skill
yishu5/claude-skills · skills/wechat-coauthor/SKILL.md · 协助意疏写「意疏的AI口袋」公众号文章。Claude 是协作者不是写手——voice 必须从意疏嘴里出来,AI 负责结构化、扩写、降 AI 味。触发:写公众号文章 / 帮我整理口述 / 有素材但想不清 / 这段 AI 味太重 /…
git:20260515.45d75b3 · audit A · 132 stars
wechat-formatter SKILL.md skill
yishu5/claude-skills · skills/wechat-formatter/SKILL.md · 把 Markdown 文稿转换成微信公众号可用的内联样式 HTML。**触发场景**:用户说 "把 markdown 转成公众号能用的 HTML" / "排版一下这篇文章" / "套个主题" / "微信编辑器不识别我的样式" /…
git:20260513.51731dc · audit A · 132 stars
wechat-publisher SKILL.md skill
yishu5/claude-skills · skills/wechat-publisher/SKILL.md · 微信公众号文章的发布管道——封面生成、本地图片上传素材库、创建草稿、发布草稿、以及从 mp.weixin URL 提取原文。**触发场景**:用户说 "发到公众号草稿箱" / "推送到公众号" / "做张公众号封面" /…
git:20260513.51731dc · audit A · 132 stars
会记成报 SKILL.md skill
yishu5/claude-skills · skills/会记成报.skill/SKILL.md · 将会议转写稿、会议笔记或聊天记录整理为可核对的会议纪要、用户本人的日报和周报素材卡,并可把本周多份已确认日报按事项合并去重生成周报。适用于:会议结束后需要沉淀纪要、待办(负责人、截止时间、完成状态);需要从会议中提取个人日报;周五需要把多份…
git:20260911.5fc2c27 · audit A · 132 stars
fangpian-brand-kit SKILL.md skill
yishu5/claude-skills · skills/方片/fangpian-brand-kit/SKILL.md · 方片新媒体(FANG PIAN / 方片,含方片母婴、方片时尚、方片家居等子品牌)官方品牌视觉规范与素材库。当需要为方片制作或修改任何视觉物料时使用——海报、小红书封面、PPT/幻灯片、公众号头图、数字人/短视频包装、头像、Banner、易…
git:20261016.5966704 · audit A · 132 stars
fangpian-course-deck SKILL.md skill
yishu5/claude-skills · skills/方片/fangpian-course-deck/SKILL.md · 方片新媒体(KOS 培训部 / 各业务线)对内培训课件的标准化模板与制作法,复刻《方片 AI 小白实战课》的"奶油底 + 方片黄 + 小老虎老师"品牌化课件风格。当需要为方片制作或改做任何教学/培训/内训/课程类幻灯片时使用——AI…
git:20261016.5966704 · audit A · 132 stars

Every file in yishu5/claude-skills

Browse by kind, by grade A, or by owner.