graphic-design

Provide structured design principles, typography, color, and SVG guidelines.

Updated Jan 31, 2026

Search Tags:#typography #design #layout #SVG #visual-design #color-theory #graphic-design

Ready to run

npx skills add https://github.com/fabioc-aloha/Alex_Sandbox --skill graphic-design

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: graphic-design
Source: https://github.com/fabioc-aloha/Alex_Sandbox/tree/main/.github/skills/graphic-design
Command: npx skills add https://github.com/fabioc-aloha/Alex_Sandbox --skill graphic-design

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The Graphic Design Skill provides structured visual-design guidelines, patterns, and templates to streamline design work and maintain consistency across projects.

Core Features & Use Cases

Design Principles: Visual hierarchy, balance, alignment, and typography best practices to guide layout decisions.
Layout & Composition: Grid systems, proportion rules, and spacing strategies for scalable UI and print layouts.
SVG & Graphics: Practical guidance for creating scalable vector graphics and icon systems.
Use Case: When starting a new branding project, apply these patterns to generate a cohesive design system and deliver assets quickly.

Quick Start

Design a web app interface by applying a 12-column grid, a 16px body text scale with 1.5x line height, and a 2-3 color palette that respects contrast guidelines.

Frequently Asked Questions about graphic-design

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

FAQPage Schema

What are the core visual design principles for building a UI layout?▼

Core visual design principles for a UI layout include visual hierarchy, balance, and alignment. Applying a structured grid system with consistent spacing strategies ensures scalable and cohesive composition across interface designs.

How do I create a typography scale for web design?▼

To create a typography scale for web design, apply structured best practices like using a 16px body text scale with 1.5x line height. This ensures readable and proportional text across layouts.

What is the best way to choose a color palette that meets contrast guidelines?▼

The best way to choose a color palette that meets contrast guidelines is limiting your selection to a 2-3 color palette. This approach respects color theory and contrast rules while maintaining visual consistency.

How do I create scalable SVG icon systems for branding projects?▼

To create scalable SVG icon systems for branding projects, follow practical SVG guidelines that provide patterns for scalable vector graphics. This ensures consistent iconography across marketing collateral and UI layouts.

Can I use these graphic design patterns for both print layouts and UI design?▼

Yes, you can use these graphic design patterns for both print layouts and UI design. The guidelines cover grid systems, proportion rules, and spacing strategies that apply to scalable layouts across multiple visual mediums.