Style Guide
This is our Style Guide to reflect our Corporate Design within our App.
Mindset: Simple and intuitive, data is more important than looks.
Our main App Icon is the red Status Icon indicating threat status DANGER. You can either take it directly from our Apps drawable-xxxhdpi folder by clicking here, or by manually extracting it from our Banner SVG or Status Icons SVG file.
- No rounded corners
- Round Icons without outline (except Status Icons)
- Square Buttons if text is used
- Round Buttons if Icons or signs are used
| COLOR | #HEX | DESCRIPTION | |
|---|---|---|---|
 |
#111111 | Background color: Screen and Navigation | |
 |
#333333 | Outline of boxes, background of box header, background of Navigation Drawer, form fields (text input, select box) | |
 |
#ffec5a | Akzent Color, text of box headlines, buttons | |
 |
#929292 | Describing text of values, "unimportant" text (for better overview) | |
 |
#f9f9f9 | "Important" values (good readability) | |
 |
#ab2424 | Map Marker (single tower), text color for alerts of all kind (or as box background color) | |
 |
#35b838 | Map Marker (more towers) | |
 |
#2668a0 | Neutral color, use for small objects (own position in the map) |
- Careful use of space, don't leave great spaces
- Flat Design (no shadows, no bevel, no shining edges)
- Rectangular prisms (if possible), 100% width for boxes and tables
- Thin lines color
#333333between text blocks and in the Navigation Drawer
- 1 Color Icons, flat and minimalistic