Skills
.Work. You
Rest

artwork-design

Community

Craft unique SVG illustrations and diagrams.

Design & Creative#react#design system#svg#tailwind#diagrams#illustration
Authormaddhruv
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill provides a comprehensive system for generating distinctive SVG artwork, illustrations, and diagrams, ensuring a consistent and visually appealing aesthetic across the product.

Core Features & Use Cases

  • Signature Hatched Patterns: Utilizes a unique diagonal hatched style in six semantic colors for fills, accents, and barriers.
  • Diverse Artwork Types: Supports isometric diagrams, traffic visualizations, world maps, flow diagrams, traffic flow illustrations, and icon badges.
  • Inline SVG & Tailwind: All artwork is implemented as inline SVG within React components, styled with Tailwind CSS for easy integration and responsiveness.
  • Use Case: Create a complex infrastructure diagram showing different service layers, or design a visually engaging hero graphic for a marketing page.

Quick Start

Use the artwork-design skill to generate an isometric diagram illustrating three layers of infrastructure.

Dependency Matrix

Required Modules

None required

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: artwork-design
Download link: https://github.com/maddhruv/cuttlefish/archive/main.zip#artwork-design

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.