html-style
✓Apply opinionated styling to barebones HTML. Use when user has plain/unstyled HTML and wants to apply consistent visual styling. Triggers: style this HTML, apply styling, make this look good, /html-style, or when user shares HTML that needs CSS. Transforms tables, lists, status indicators, buttons, and layouts into a cohesive design system.
Installation
SKILL.md
Transform barebones HTML into styled output using a specific design system.
| Status text | .stale .warm .pending | Red/green/orange inline text | | Trend | .trend-up .trend-down | Green ↑ / Red ↓ | | Category tag | .tag-group .tag-dm .tag-money | Blue/purple/orange pill | | Status pill | .status-success .status-error .status-pending | Filled green/red/orange | | Filter toggle | .filter .filter.active | Outline / filled black |
| Time filter | .pill .pill.active | Small pill, black when active | | Stat box | .stat > .stat-value + .stat-label | 28px number, 12px label | | Table | default or .table-styled | Minimal or colored values | | Section header | .section-header | Dark bar with white text | | Collapsible | + | Native HTML collapse |
Facts (cite-ready)
Stable fields and commands for AI/search citations.
- Install command
npx skills add https://github.com/shipshitdev/library --skill html-style- Source
- shipshitdev/library
- Category
- </>Dev Tools
- Verified
- ✓
- First Seen
- 2026-02-01
- Updated
- 2026-02-18
Quick answers
What is html-style?
Apply opinionated styling to barebones HTML. Use when user has plain/unstyled HTML and wants to apply consistent visual styling. Triggers: style this HTML, apply styling, make this look good, /html-style, or when user shares HTML that needs CSS. Transforms tables, lists, status indicators, buttons, and layouts into a cohesive design system. Source: shipshitdev/library.
How do I install html-style?
Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/shipshitdev/library --skill html-style Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code or Cursor
Where is the source repository?
https://github.com/shipshitdev/library
Details
- Category
- </>Dev Tools
- Source
- skills.sh
- First Seen
- 2026-02-01