-
Notifications
You must be signed in to change notification settings - Fork 6
Design Standards
luckyy14 edited this page Mar 31, 2020
·
6 revisions
- Use a 4 color palette. It consists of white, red, purple and black.
- Try to follow material design. (https://material.io/design/)
- Use fontawesome or our own icons for iconography.
- Use jQuery for animation.
- Stick to our template and use the components provided in them (widgets, cards, forms etc.) instead of creating new ones.
-
Font Family: Roboto
| Element | Specs |
|---|---|
| Normal | 1rem |
| Page Title | 3.21rem |
| Heading | 2.42rem |
| Sub-Heading | 1.42rem |
| Element | Specs |
|---|---|
| Normal Text | #000000(black) |
| Button Text | #FFFFFF(white) |
| Link Text(active) | #5e72e4(Blue) |
| Link Text(visited) | No change |
| Element | Specs |
|---|---|
| Normal | 1.72rm |
| Page Title | 3.21rem |
| Heading | 2.86rem |
| Sub-Heading | 2.14rem |
- Buttons should have a width to height ration of 144:40 (preferable 144px width by 40 px height).
- Small icons like checkboxes should be 28px.
- Minimum spacing between any two elements including space between an element and screen border itself should be not less than 19px.