design-systems: add 74 brand DESIGN.md files (VoltAgent/awesome-design-md)

- 74 brands: airbnb, stripe, apple, figma, linear, vercel, etc.
- 147 files: DESIGN.md + README.md per brand (~2.1 MB)
- Each DESIGN.md contains structured brand analysis (colors, typography, components)
- Updated 00-overview.md with new design-systems directory
This commit is contained in:
neo committed 2026-06-21 20:40:35 +05:00
1 parent e3738f2b3e
commit 76c4c5b4fe
233 files changed
+54886 -1

No files matched your search

+63
View File
@@ -0,0 +1,63 @@
---
title: Accessibility (WCAG) Standards
description: Web accessibility guidelines for premium design.
tags: [accessibility, wcag, contrast, screen-reader, keyboard]
---
# Accessibility (WCAG) Standards
## WCAG 2.1 Level AA Requirements
### 1. Perceivable
- Text alternatives for non-text content
- Captions for multimedia
- Content adaptable (1 column, no scroll)
- Color contrast: 4.5:1 (normal), 3:1 (large)
### 2. Operable
- Keyboard accessible
- Enough time to read/use
- No flashing >3 times/second
- Navigable (skip links, headings, focus)
### 3. Understandable
- Readable text
- Predictable navigation
- Input assistance (labels, placeholders)
### 4. Robust
- Compatible with assistive tech
- Valid HTML
- ARIA labels where needed
## Focus Management
```css
:focus-visible {
outline: 2px solid var(--accent-primary);
outline-offset: 2px;
border-radius: 2px;
}
```
## Screen Reader Patterns
```html
<!-- Skip link -->
<a href="#main" class="skip-link">Skip to content</a>
<!-- Landmarks -->
<header role="banner">...</header>
<nav role="navigation">...</nav>
<main role="main">...</main>
<footer role="contentinfo">...</footer>
<!-- Live regions -->
<div aria-live="polite" role="status">Loading...</div>
```
## Anti-Patterns
- Never rely on color alone
- Never remove focus outlines without replacement
- Never use `display: none` for hiding content that should be accessible
- Never skip heading hierarchy (h1 → h2 → h3)