Add sub-skills from ui-ux-pro-max-skill repo

Added:
- banner-design (new)
- brand (new)
- design-system (new)
- slides (new)
- ui-ux-pro-max data/scripts (from GitHub clone)
- ui-styling data/scripts (from GitHub clone)
This commit is contained in:
2026-04-16 18:33:32 +07:00
parent b26c8199a5
commit da5f964d9a
87 changed files with 18254 additions and 2 deletions

View File

@@ -0,0 +1,96 @@
# Visual Identity Basics
## Core Visual Elements
### Logo
- **Primary:** Full logo (horizontal/stacked)
- **Secondary:** Abbreviated version
- **Icon/Mark:** Symbol only
- **Clear space:** Minimum padding around logo
- **Minimum size:** Smallest readable size
### Color Palette
```
Primary Colors (1-2)
├── Main brand color
└── Supporting primary
Secondary Colors (2-3)
├── Accent colors
└── Supporting visuals
Neutrals (3-4)
├── Text colors
├── Background colors
└── UI elements
```
### Typography
| Usage | Font | Weight | Size |
|-------|------|--------|------|
| H1 | [Font] | Bold | 32-48px |
| H2 | [Font] | Semibold | 24-32px |
| Body | [Font] | Regular | 16-18px |
| Caption | [Font] | Regular | 12-14px |
## Visual Guidelines Template
```markdown
## Logo Usage
### Correct Usage
- [Guidelines for proper logo use]
### Incorrect Usage
- Don't stretch or distort
- Don't change colors (unless approved)
- Don't add effects
- Don't place on busy backgrounds
## Color Specifications
### Primary Palette
| Color | Hex | RGB | Usage |
|-------|-----|-----|-------|
| [Name] | #XXXXXX | r,g,b | [Where to use] |
### Accessibility
- Text contrast ratio: 4.5:1 minimum
- Button contrast: WCAG AA compliant
## Imagery Style
### Photography
- [Lighting preferences]
- [Subject guidelines]
- [Composition rules]
- [Editing style]
### Illustrations
- [Style description]
- [Color usage]
- [Complexity level]
### Icons
- [Style: outlined/filled/duotone]
- [Stroke weight]
- [Corner radius]
```
## Quick Checks
### Logo
- [ ] Correct version for context
- [ ] Sufficient clear space
- [ ] Legible at size used
- [ ] Correct color for background
### Colors
- [ ] From approved palette
- [ ] Accessible contrast
- [ ] Consistent across materials
### Typography
- [ ] Correct fonts
- [ ] Appropriate hierarchy
- [ ] Readable size