Home / Skills / image-to-code

image-to-code

Elite website image-to-code skill for Codex. For visually important web tasks, it must first generate the design image(s) itself, deeply analyze them, then implement the website to match them as closely as possible. In Codex, it must prefer large, readable, section-specific images instead of tiny compressed boards, generate fresh standalone images for sections or detail views instead of cropping old ones, avoid lazy under-generation, avoid cards-inside-cards-inside-cards UI, and keep the hero clean, spacious, readable, and visible on a small laptop.

ScannedSkillSource: GitHub

9,268 stars +11 this week Updated 16d ago License MIT Context ≈142 tokens always loaded

79popular

Why this score

Stars

21/35

Usage (forks)

8/15

Upkeep

25/25

License

15/15

Owner history

10/10

This repo hosts 10 skills, so its 9,268 stars are split between them (about 927 each) for scoring.

Popularity score: 79/100 from public GitHub signals only. It shows how widely used and maintained this is, not how well it works. Not included yet: the fake-star check. The security scan is shown separately and doesn't change the score. How we rank

Security

Scanned Oct 20, 2026 at commit d8b7820850e3, with Cisco's open-source skill-scanner.

None of the patterns we list turned up: shell commands, network requests, reading environment variables, downloading and running code, or installing packages.

A scan lists patterns in the code. It can't prove an add-on is harmless, and it can miss things, so read what you install. How we scan

Alternatives

Other makers' add-ons that do the same job, next to this one.

Name	Score	Stars	Context	Updated
This oneimage-to-code mediago-dev/mediago · Skill	79	★ 9.3k	≈142 always	16d ago
image-to-psd DSY-Xueai/image2editable · Skill Both about image	62	★ 56	≈31 always	26d ago
image-to-video pexoai/pexo-skills · Skill Both about image	57	★ 810	≈27 always	3mo ago
image-to-3d guinacio/claude-image-gen · Skill Both about image and itself	63	★ 77	≈126 always	25d ago
blender-image-to-3d jangtrinh/design-os-3d-blender · Skill Both about image	60	★ 102	≈53 always	20d ago
image-to-video-shots xianyu110/ecommerce-video-skills · Skill Both about image	54	★ 84	≈85 always	1mo ago

Install

mkdir -p .claude/skills/image-to-code

curl -sL https://codeload.github.com/mediago-dev/mediago/tar.gz/d8b7820850e37a9c56fbf0dac213f286743c5328 | tar -xz -C .claude/skills/image-to-code --strip-components=4 "mediago-d8b7820850e37a9c56fbf0dac213f286743c5328/.agents/skills/image-to-code"

To remove it later:

rm -rf .claude/skills/image-to-code

npx skills add mediago-dev/mediago --skill image-to-code

Pinned to commit d8b7820850e3 as listed by GitHub.

Context cost: ≈142 tokens loaded every session (name and description), plus ≈9.1k tokens when the skill is used.

The Claude Code command downloads this skill folder at the pinned commit into .claude/skills/. The Skills CLI (npx skills) works with many agents but can't pin a version, so it installs whatever is current.

Facts

Repo: mediago-dev/mediago
Stars: 9,268
Forks: 824
Last push: 2026-10-19 (16d ago)
License: MIT
Owner: mediago-dev · since 2024
Language: TypeScript
Works with: Claude Code, Skills CLI