image-to-css-art
From the author
Convert a supplied raster reference into a faithful, standalone HTML/CSS illustration using offline color segmentation, contour tracing and local gradients. Use when the user asks for pure CSS art, image-to-HTML illustration, or high-fidelity reference recreation that forbids img, SVG, Canvas, JavaScript, base64 and external assets. Requires a local reference image and permission to run offline Python authoring tools. Do not use for website screenshot implementation, semantic hand-authored CSS characters, vector editing, or bitmap image generation.
Install
npx skills add AvroraCL/image-to-css-art --skill image-to-css-art -a claude-code
Installs to .claude/skills/image-to-css-art/ · Each command fetches the skill straight from GitHub with the open skills CLI.
Byte-identical to the scanned commit, with the repository’s licence and a SOURCE.txt.
Want your agent to suggest skills while you type? See how to use skills from your IDE.
Safety checks on SKILL.md
- Ships scripts we have not reviewedLow
Why 75
aiqbench computes the trust score from public signals. It is not a security audit, so read a skill before you install it.
Similar skills
Closest to this one by what they do and when they are used.
- image-to-svgoaustegard/claude-skillsConvert raster images (photos, paintings, illustrations, line art) into SVG vector reproductions. Use when the user uploads an image and asks to reproduce, vectorize, trace, or convert it to SVG. Also use when asked to decompose an image into shapes, create an SVG version of a picture, or faithfully reproduce artwork as vector graphics. Handles graphic/line-art inputs (Kandinsky, architectural drawings, ink work) via a compositional pipeline that extracts lines as SVG strokes. Do NOT use for creating original SVG illustrations from text descriptions — only for converting existing raster images.Media★ 158
- imagegenopenai/skillsGenerate or edit raster images when the task benefits from AI-created bitmap visuals such as photos, illustrations, textures, sprites, mockups, or transparent-background cutouts. Use when Codex should create a brand-new image, transform an existing image, or derive visual variants from references, and the output should be a bitmap asset rather than repo-native code or vector. Do not use when the task is better handled by editing existing SVG/vector/code-native assets, extending an established icon or logo system, or building the visual directly in HTML/CSS/canvas.OfficialDesign★ 28.5K
- image-to-uihashgraph-online/awesome-codex-pluginsRecreate an image, screenshot, or mockup as a 1:1 UI implementation. Match the reference rather than redesigning it, then render and compare the result to correct visible differences.Design★ 1.5K
- pixel-artwanshuiyin/Auto-claude-code-research-in-sleepGenerate pixel art SVG illustrations for READMEs, docs, or slides. Use when user says "画像素图", "pixel art", "make an SVG illustration", "README hero image", or wants a cute visual.Documents★ 18.6K
- image-to-codeplugin87/ux-ui-agent-skillsTurn a reference image, screenshot, or mockup into token-driven, accessible code. Infer the design system from the reference (palette, type scale, spacing, radius, layout archetype), map it to the 3-tier tokens, rebuild it, then verify with the kit's gates. Use when the user provides a design/screenshot and wants matching UI code.Media★ 3.1K
- street-portrait-artistkyungseo/skillsteadAnalyze supplied portrait references into a stable impression map, then create a kind Street Caricature, Romance Watercolor portrait, or Paper-Cut Illustration with coherent feature relationships and targeted revision. Use when a real person's recognizable visual identity should be interpreted rather than traced. Do not use for graffiti or murals, restoration, face swaps, photorealistic retouching, personality inference, or imitation of a named living artist.Media★ 83
Ratings & reviews
—
no reviews
Tried this skill? Rate it to help others. Sign in
Discussion
Join the discussion. Sign in