skills.rest
fabioc-aloha
fabioc-alohaCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

Graphic Design Skill

Guide visual design with layout, typography, color theory, and SVG creation.

1|1|Updated Nov 20, 2025
Search Tags:#typography#graphic design#branding#layout#visual design#color theory#SVG
One-click install
npx skills add https://github.com/fabioc-aloha/AIRS_Data_Analysis --skill graphic-design-skill
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: Graphic Design Skill
Source: https://github.com/fabioc-aloha/AIRS_Data_Analysis/tree/main/.github/skills/graphic-design
Command: npx skills add https://github.com/fabioc-aloha/AIRS_Data_Analysis --skill graphic-design-skill

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) and synapses (resource) components.

What problem does it solve?

This Skill provides comprehensive guidance on visual design principles, layout composition, typography, color theory, and icon design, enabling users to create aesthetically pleasing and effective visual content.

Core Features & Use Cases

  • Design Principles: Learn about visual hierarchy, balance, and layout techniques like grid systems and the rule of thirds.
  • Typography: Understand type scales, font pairing, and best practices for readability.
  • Color Theory: Explore color relationships, schemes, psychology, and accessibility standards.
  • SVG Design: Learn SVG structure, common elements, path commands, and transforms.
  • Icon & Illustration Design: Principles for creating clear, consistent, and impactful icons and illustrations.
  • Use Case: A user needs to design a new banner for their VS Code extension. They can consult this Skill for recommended dimensions, composition strategies, and best practices for visual elements and typography.

Quick Start

Provide guidance on creating a visually hierarchical layout for a marketing brochure.

Frequently Asked Questions about Graphic Design Skill

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
What are the best practices for typography and color theory in visual design?▼

Visual design best practices involve using type scales for font pairing, ensuring readability, and applying color theory relationships alongside accessibility standards to create aesthetically pleasing compositions.

How do I create an SVG icon from scratch using path commands?▼

To create an SVG icon, you structure common SVG elements and use path commands alongside transforms to draw clear, consistent vector graphics following established icon design principles.

How do I design a visually hierarchical layout for a marketing brochure?▼

Designing a visually hierarchical layout requires applying visual hierarchy, balance, and grid systems like the rule of thirds to effectively organize content and guide the viewer's eye.

Can I use these graphic design principles to create a banner for a VS Code extension?▼

Yes, you can use these graphic design principles to create a VS Code extension banner by consulting recommended dimensions, composition strategies, and best practices for visual elements and typography.

What is the role of design system tokens in brand-consistent visual assets?▼

Design system tokens maintain brand consistency across visual assets by defining reusable values for colors, typography, and spacing, ensuring accessible and unified design implementation across various platforms.

Related Skills

Explore More Design & Creative Skills→
ncsound919ncsound919

visual-design-foundations

Standardize typography, color, spacing, and iconography into design tokens and guidelines.

Community
Advanced
hellobanorahellobanora

visual-assets

Create and optimize website visual assets for a chiropractic brand.

Community
Advanced
omanjayaomanjaya

frontend-design

Provide typography, color, spacing, and motion guidelines for web UI design.

Community
Intermediate
IsNoobgrammerIsNoobgrammer
4

logo-favicon

Generate SVG logos, favicons, and social media assets from project names.

Community
Advanced