AI Skill MartBrowse skillsPromptsProgramsLearnWhat is a Skill?
 
← Back to list

Beautify GitHub README

Redesigns a repository homepage and produces project-native SVG heroes, section headers, diagrams, and opt-in GIFs.

Design & UIIntermediate★ 1,923⑂ 131AI score 9/10Last updated: Oct 4, 2026

What it does

  • Picks exactly one mode: README mode (restructure information order, copy hierarchy, and proof) or asset-only mode (create visuals while leaving the README byte-for-byte unchanged).
  • Derives palette, typography, and a recurring motif from the repository itself instead of reusing one template everywhere.
  • Explains and confirms the implementation: pure SVG (deterministic, light, scalable) vs hybrid composition (SVG layout + ImageGen raster → published PNG/WebP).
  • Respects real GitHub rendering limits (no scripts, foreignObject, remote fonts, or SVG-embedded animation) and only produces a GIF if you opt in.
  • Verifies output with scripts/audit_readme.py, wide/narrow previews, dark/light contrast, and minimum SVG text sizes.

Who it's for

  • Open-source maintainers who want a convincing first screen
  • Developers who want side projects to look portfolio-grade
  • Teams without a designer who need a consistent README asset set

Examples

  1. "Redesign this repo homepage around its developer-tool theme" → new reading order plus an SVG hero and proof board
  2. "Create one SVG hero and three section headers without touching the README" → asset-only output in assets/readme/
  3. "Make a GitHub-safe animated GIF hero and keep the SVG source" → GIF plus static SVG fallback after preview approval

· · · Install guide · · ·

Try it now, no install

Paste this into Claude to use the skill without installing anything.

Read the instructions in this file and follow them to help me:
https://raw.githubusercontent.com/oil-oil/beautify-github-readme/HEAD/skills/beautify-github-readme/SKILL.md

What I want: (describe your task here)

If Claude can't open the link, open it yourself and paste the contents instead.

↓ If it works for you, download the ZIP below and install it. Then it runs on its own — no pasting each time.

Install in the Claude app (no terminal)
  1. Download the ZIP with the button below.
  2. In Claude, open Settings → Capabilities and turn on 'Code execution and file creation'. (one time)
  3. Go to Customize → Skills → + → 'Upload a skill' and upload the ZIP.
↓ Download ZIP
Install in Claude Code

Let Claude do it — paste this into Claude Code

Install the skill I found on AI Skill Mart.
Copy the skills/beautify-github-readme folder from the GitHub repo oil-oil/beautify-github-readme into my ~/.claude/skills/beautify-github-readme/.
When it's done, tell me in one line what this skill can do.

Install with a command instead

git clone https://github.com/oil-oil/beautify-github-readme.git /tmp/bgr && mkdir -p ~/.claude/skills && cp -r /tmp/bgr/skills/beautify-github-readme ~/.claude/skills/

⚠ This is a third-party skill. Check the source repository before installing.

  1. Open a terminal.
  2. Clone the repo: git clone https://github.com/oil-oil/beautify-github-readme.git /tmp/bgr
  3. Create the skills folder: mkdir -p ~/.claude/skills
  4. Copy the skill: cp -r /tmp/bgr/skills/beautify-github-readme ~/.claude/skills/
  5. Confirm the bundled references/ docs and scripts/audit_readme.py came along.
  6. For GIF output, make sure python3 is available (python3 --version).
  7. Restart Claude Code and invoke it with Use $beautify-github-readme to ...
View source on GitHub ↗License: MIT