artifact-css

OUTPUT IS ALWAYS A SINGLE `.html` FILE (never `.md`, never plain markdown, never a text response) styled with the artifact.css class vocabulary. Use this skill whenever producing a standalone HTML artifact that is meant to be read, reviewed, or interacted with as a document. This includes status reports, post-mortems, implementation plans, PR reviews, design systems, explainers, comparisons, slide decks, and interactive editors. Apply this skill any time the user asks for an HTML page, web page, report, dashboard, or any "show me" / "draw me" / "visualize" output that should look polished rather than developer-default. The skill provides a lightweight design system (artifact.css) with a unified color palette, typography, and component vocabulary so the artifact reads as a real document, not a rough sketch. Do not use for production apps, marketing sites, or anywhere a separate design system is already in play.

Works with

Claude CodeCursorCodex CLIGitHub CopilotGemini CLI

This skill's source license couldn't be confirmed as safe to mirror here, so it isn't inlined. View the full skill directly on its source repository.

View on GitHub

More Code Review skills

pr-to-video

heygen-com/hyperframes

Turn a GitHub pull request (a PR URL, owner/repo#N, or 'this PR' in a checked-out repo) into a code-change explainer video — changelog, feature reveal, fix, or refactor walkthrough built from the diff, commits, and files: the input is a code change, not a website. Not a product promo (/product-launch-video) or a no-PR topic explainer (/faceless-explainer). Unclear → /hyperframes.

178.9k

receiving-code-review

obra/superpowers

Use when receiving code review feedback, before implementing suggestions, especially if feedback seems unclear or technically questionable - requires technical rigor and verification, not performative agreement or blind implementation

178.0k

public-relations

coreyhaines31/marketingskills

When the user wants help with public relations, earned media, press coverage, journalist outreach, or media strategy (not pull requests). Also use when the user mentions 'PR,' 'public relations,' 'press,' 'press release,' 'press coverage,' 'media outreach,' 'pitch a journalist,' 'get featured,' 'media list,' 'media kit,' 'press kit,' 'newsjacking,' 'news hijack,' 'HARO,' 'Qwoted,' 'Featured,' 'Help A Reporter,' 'reporter request,' 'tech press,' 'TechCrunch,' 'earned media,' 'thought leadership placement,' 'op-ed,' 'guest article,' 'press contacts,' 'podcast prep,' 'going on a podcast,' 'podcast guest,' 'prep me for this podcast,' or 'how do I get press.' Use this for earned media work — finding journalists, pitching stories, newsjacking, prepping podcast appearances, and responding to press requests. For startup/SaaS/AI directory submissions, see directory-submissions. For product launches, see launch. For social-media engagement, see social. For cold-email outreach to prospects, see cold-email.

33.1k

← All Code Review skills

Check your AI visibility

One URL in, a 0–100 score and the exact fixes out.

RUN THE CHECK

Browse all the tools

15 tools across six categories
13 of them never send your data anywhere

Free · No signup · No trial clock

SEE THE DIRECTORY