Menu

#546 by GitHub stars

oil-oil/beautify-github-readme

Redesign GitHub README homepages or create project-native pure SVG, hybrid SVG-composed PNG/WebP, and opt-in animated GIF assets. Use when a user asks to beautify, redesign, rebrand, visually upgrade, simplify, or audit a GitHub README; create only a hero, section headers, diagrams, badges, motion g

DesignDocumentation

History

Review weekly changes to SKILL.md before updating. Dates mark the weeks in which we observed each version; checks apply to the recorded commits.

View weekly changes

skills/beautify-github-readme/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Network or broad shell → After Network or broad shell

d6562a5f5c48 → d6562a5f5c48

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Network or broad shell

First observation → d6562a5f5c48

No earlier version was observed for comparison.

Compare on GitHub

View on GitHubAdd to my skills

Verified commit d6562a5f5c484d069f8560b39c215c9cda4b5a55

2kGitHub stars
21stars in 7 days
1skill in this repository
0commits in 30 days

Heat

5.4
  • Star growth, last 7 daysAhead of 85% of tracked repositories
  • Star growth, last 24 hoursAhead of 84% of tracked repositories
  • Rank movement, last 7 daysAhead of 35% of tracked repositories
  • Commits, last 30 daysAhead of 0% of tracked repositories
  • Accounts asking about it through MCP, last 7 daysNot available
  • Hot votes this weekAhead of 0% of tracked repositories

Heat never changes the order by stars, and sponsorship never touches it. How heat works

Stars over time

Aug 2, 2026Nov 6, 20261,951

Individual skills in this repository

How it works

beautify-github-readme

When your agent uses it

Redesign GitHub README homepages or create project-native pure SVG, hybrid SVG-composed PNG/WebP, and opt-in animated GIF assets. Use when a user asks to beautify, redesign, rebrand, visually upgrade, simplify, or audit a GitHub README; create only a hero, section headers, diagrams, badges, motion graphics, showcase modules, or other README assets; or turn a repository homepage into a cohesive visual story. If whole-README work versus asset-only work is unclear, ask which scope the user wants. For hero-like assets where pure SVG and generated raster material are both viable, explain the tradeoffs and confirm the implementation before creating the asset.

What it loads into context

Frontmatter

147 tokens

Always available to the agent

SKILL.md

3,256 tokens

When the skill is activated

Reference documents

8,201 tokens

Loaded on request

Token counts are estimates. Scripts run separately; they are not counted as reference context.

The playbook

  1. Workflow
  2. Quality bar
  3. Invocation examples

Scripts executed separately

  • scripts/audit_readme.py
  • scripts/render_motion_gif.py

Files

  • SKILL.mdcore16,383 bytes
  • SKILL.mdcore16,383 bytes
  • SKILL.mdcore16,383 bytes
  • SKILL.mdcore16,383 bytes
  • SKILL.mdcore16,383 bytes
  • SKILL.mdcore16,383 bytes
  • agents/openai.yamlasset328 bytes
  • references/content-architecture.mddoc1,311 bytes
  • references/github-readme-canvas.mddoc3,370 bytes
  • references/hybrid-svg-production.mddoc4,646 bytes
  • references/motion-production.mddoc6,862 bytes
  • references/project-native-hero.mddoc6,055 bytes
  • references/showcase-contribution.mddoc2,611 bytes
  • references/svg-production.mddoc10,112 bytes
  • references/visual-direction.mddoc3,732 bytes
  • scripts/audit_readme.pyruns2,762 bytes
  • scripts/render_motion_gif.pyruns19,805 bytes
Read SKILL.md

# Beautify GitHub README

Turn a repository homepage or requested visual asset into a concise, theme-specific visual story. Treat Markdown as the content layer, deterministic SVG as the layout system, and generated raster material as an optional visual ingredient.

## Workflow

### 1. Confirm the mode before editing

Use exactly one execution mode:

- **README mode** — improve the whole README: information order, copy hierarchy, proof, Markdown, and visual system.
- **Asset-only mode** — create only the requested static SVG or visual asset set. Static SVG is the default. Only after the user explicitly opts into meaningful motion, optionally deliver a GitHub-safe GIF while keeping the SVG as the editable fallback. Do not rewrite, reorder, or embed anything in the README unless the user explicitly adds that scope.

If the mode is not explicit, ask one compact question before making changes:
View the complete source on GitHub

Skills included

  • beautify-github-readme

Repository facts

License
MIT
Created
Jul 13, 2026
Last pushed
Oct 4, 2026
Forks
132
Open issues
3
Project activity
Active

Rank over the last 12 weeks

Now #546 · best #428 · down 54 in 30 days

  1. #539 on Nov 2
  2. #542 on Nov 3
  3. #543 on Nov 4
  4. #544 on Nov 5
  5. #545 on Nov 6
  6. #546 since Nov 7
86 earlier periods
  1. #435 on Aug 2
  2. #435 on Aug 7
  3. #437 on Aug 8
  4. #430 on Aug 9
  5. #444 on Aug 10
  6. #440 on Aug 11
  7. #437 on Aug 12
  8. #444 on Aug 13
  9. #440 on Aug 14
  10. #432 on Aug 15
  11. #434 on Aug 16
  12. #442 on Aug 17
  13. #446 on Aug 18
  14. #444 on Aug 19
  15. #438 on Aug 20
  16. #440 on Aug 21
  17. #428 on Aug 22
  18. #445 on Aug 23
  19. #444 on Aug 24
  20. #445 on Aug 25
  21. #440 on Aug 26
  22. #447 on Aug 27
  23. #446 on Aug 28
  24. #439 on Aug 29
  25. #431 on Aug 30
  26. #448 on Aug 31
  27. #454 on Sep 1
  28. #446 on Sep 2
  29. #451 on Sep 3
  30. #440 on Sep 4
  31. #442 on Sep 5
  32. #445 on Sep 6
  33. #448 on Sep 7
  34. #459 on Sep 8
  35. #458 on Sep 9
  36. #459 on Sep 10
  37. #456 on Sep 11
  38. #455 on Sep 12
  39. #452 on Sep 13
  40. #463 on Sep 14
  41. #461 on Sep 15
  42. #468 on Sep 16
  43. #461 on Sep 17
  44. #469 on Sep 18
  45. #452 on Sep 19
  46. #463 on Sep 20
  47. #461 on Sep 21
  48. #470 on Sep 22
  49. #466 on Sep 23
  50. #456 on Sep 24
  51. #458 on Sep 25
  52. #453 on Sep 26
  53. #471 on Sep 27
  54. #476 on Sep 28
  55. #484 on Sep 29
  56. #482 on Sep 30
  57. #477 on Oct 1
  58. #472 on Oct 2
  59. #460 on Oct 3
  60. #455 on Oct 4
  61. #465 on Oct 5
  62. #476 on Oct 6
  63. #480 on Oct 7
  64. #492 on Oct 8
  65. #488 on Oct 9
  66. #483 on Oct 10
  67. #484 on Oct 11
  68. #497 on Oct 12
  69. #492 on Oct 13
  70. #493 on Oct 14
  71. #494 on Oct 15
  72. #498 on Oct 16
  73. #485 on Oct 17
  74. #488 on Oct 18
  75. #502 on Oct 19
  76. #507 on Oct 20
  77. #510 on Oct 21
  78. #502 on Oct 22
  79. #497 on Oct 23
  80. #485 on Oct 24
  81. #528 on Oct 25
  82. #532 on Oct 28
  83. #535 on Oct 29
  84. #536 on Oct 30
  85. #537 on Oct 31
  86. #538 on Nov 1

Before you install

Network or broad shell

Automated signals, not a guarantee

Checked Nov 3, 2026

Not fully analyzed: some files were too long, unreadable or missing. This never lowers the level.

Show 5 notes
  • skills/beautify-github-readme/SKILL.md:1 Analysis incomplete: Referenced executable target unavailable; not analyzed
  • skills/beautify-github-readme/SKILL.md:1 Analysis incomplete: Referenced executable target unavailable; not analyzed
  • skills/beautify-github-readme/SKILL.md:1 Analysis incomplete: Referenced executable target unavailable; not analyzed
  • skills/beautify-github-readme/SKILL.md:1 Analysis incomplete: Referenced executable target unavailable; not analyzed
  • skills/beautify-github-readme/SKILL.md:1 Analysis incomplete: Referenced executable target unavailable; not analyzed
Show all 10 signals by file

skills/beautify-github-readme/references/showcase-contribution.md

  • Network accessline 26
    1. Inspect the latest default branch of `https://github.com/oil-oil/beautify-github-readme`.

skills/beautify-github-readme/references/svg-production.md

  • Network accessline 46
    <svg xmlns="http://www.w3.org/2000/svg"
  • Network accessline 164
    - Derive the background, accent, shape, and one small motif from the repository itself. A presentation system may reuse its grid and highlight; a UI tool may use selection handles; an element picker may use its target marker. - Put the sign
  • Network accessline 165
    - Put the signature near the README footer, usually before License. It should close the page quietly, not become another hero. - Wrap the image in a link to `https://github.com/oil-oil/beautify-github-readme` and provide the alt text `READM
  • Network accessline 166
    - Wrap the image in a link to `https://github.com/oil-oil/beautify-github-readme` and provide the alt text `README made with beautify-github-readme`. - Include `<title>`, `<desc>`, and a complete background so it stays readable on GitHub li
  • Network accessline 174
    <p align="center">   <a href="https://github.com/oil-oil/beautify-github-readme"><img src="./assets/readme/made-with-beautify.svg" width="300" alt="README made with beautify-github-readme"></a>
  • Network accessline 175
    <a href="https://github.com/oil-oil/beautify-github-readme"><img src="./assets/readme/made-with-beautify.svg" width="300" alt="README made with beautify-github-readme"></a>

skills/beautify-github-readme/scripts/audit_readme.py

  • Executable scriptline 1
    #!/usr/bin/env python3

skills/beautify-github-readme/scripts/render_motion_gif.py

  • Executable scriptline 1
    #!/usr/bin/env python3
  • Network accessline 24
    SVG_NS = "http://www.w3.org/2000/svg"

How the signals fit together

Facts from a static read of the files at the pinned commit. They describe what the code does, not why.

Some files could not be read; the facts below still hold.

No combined signals at this commit.

Works with

Agent compatibility, from the files in this repository
AgentStatusEvidenceInstall to
Claude CodeCompatibleStandard SKILL.md skills/beautify-github-readme/SKILL.md.claude/skills/<skill-name>/
CodexCompatibleStandard SKILL.md skills/beautify-github-readme/SKILL.md.agents/skills/<skill-name>/
CursorCompatibleStandard SKILL.md skills/beautify-github-readme/SKILL.md.cursor/skills/<skill-name>/
Gemini CLICompatibleStandard SKILL.md skills/beautify-github-readme/SKILL.md.gemini/skills/<skill-name>/
GitHub CopilotCompatibleStandard SKILL.md skills/beautify-github-readme/SKILL.md.github/skills/<skill-name>/
OpenCodeCompatibleStandard SKILL.md skills/beautify-github-readme/SKILL.md.opencode/skills/<skill-name>/
  • Native The repository ships a manifest, folder or frontmatter field for this agent.
  • Compatible A standard SKILL.md that this agent can read.
  • Unknown No evidence either way.

Derived automatically from paths, manifests and frontmatter. Not tested on each agent.

You might also use

oil-oil/oil-cover

Video cover & thumbnail skill for Claude Code & Codex. 帮你用视频画面做小红书和 B 站封面。

290GitHub stars

oil-oil/oil-motion

把 AI 生成或已有的视频、序列帧变成随滚动、指针、拖动、触摸、设备方向、音频、数据或状态变化的网页动画：设计动作方向，生成关键帧与视频，整理成图集或视频，编译时间轴并接入运行时。用…

2.8kGitHub stars

oil-oil/draw-ui

UI design & mockup skill for Claude Code & Codex, from screenshot to code. 帮你出 UI 设计稿并还原成页面。

544GitHub stars

oil-oil/oil-icon

AI icon set generator skill for Claude Code & Codex. 帮你生成整套风格统一的图标。

331GitHub stars

alchaincyf/huashu-design

花叔Design——用HTML做高保真原型、幻灯片、动画、可视化与专家评审。任何新设计100%先出三个方向初稿给用户选（指定风格/品牌也不豁免），选定后才执行。触发词：做原型、PPT、幻灯片、动画、…

28.9kGitHub stars

Appllama/appllama-skills

A builder, not just a researcher. Agent skills that turn top-grossing app patterns into native-quality mobile screens.

4.9kGitHub stars

Explore alternatives and comparisons

Add this badge to your README

It updates every night and links to this page.

oil-oil/beautify-github-readme: #546 on hotskills, 2k stars

[![oil-oil/beautify-github-readme on hotskills](https://hotskills.dev/badge/oil-oil-beautify-github-readme.svg)](https://hotskills.dev/skill/oil-oil-beautify-github-readme/)