🎨 Design
Getting started
This is the
| Excerpt |
|---|
The Save The Republic design system. In order to keep our message clear the following guidelines have been established. |
For now, let’s follow the USWDS: The United States Web Design System
Design principles
Principle one | Principle two | Principle three |
|---|---|---|
SimplicitySimple | Clean | Concise |
Visual language
Color
DO:
Use the approved color palettes
DON'T:
Go off the beaten path, let’s keep the design consistent across all mediums.
Typography
DO:
DON'T:
Sizing & spacing
DO:
DON'T:
Icons & illustrations
DO:
DON'T:
✏ Writing
Cheatsheet
Word | Rule |
|---|---|
Style, spelling, grammar
House rules
Capitalization
DO:
DON'T:
Punctuation
DO:
DON'T:
Formatting
DO:
DON'T:
Abbreviation & acronyms
DO:
DON'T:
Numbers & percentages
DO:
DON'T:
Dates and times
DO:
DON'T:
Lexicon
Word | Rule |
|---|---|
👩💻 Build
Best practices
Accessibility
DO:
DON'T:
Browser support
Browser | Version | Priority |
|---|---|---|
Actions
<Element name (e.g., Button)>
| Code Block |
|---|
Name | Required | Type | Allowed value | Default values | Description | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| e.g., Changes the visual styling of the Button | ||||||||||||||||
<Element name (e.g., Link)>
| Code Block |
|---|
Name | Required | Type | Allowed value | Default values | Description | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| |||||||||||||||||
Forms
| Code Block |
|---|
Name | Required | Type | Allowed value | Default values | Description | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| |||||||||||||||||
Feedback
| Code Block |
|---|
Name | Required | Type | Allowed value | Default values | Description | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| |||||||||||||||||
Navigation
| Code Block |
|---|
Name | Required | Type | Allowed value | Default values | Description | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| |||||||||||||||||
Accessibility
| Code Block |
|---|
Name | Required | Type | Allowed value | Default values | Description | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| |||||||||||||||||