mirror of
https://github.com/bitwarden/brand
synced 2025-12-06 05:23:20 +00:00
Brand updates 23 apr24 (#37)
* Color/brand Update Update color descriptions, font files, logos, and screenshots. Added tables for more clarity and a palette file. * Forgot to add list * Remove bang from list * Add cell for color codes The tables look better with a cell for the color codes. * Update Readme remove extra logo link and add screenshot image * remove black logo
This commit is contained in:
61
README.md
61
README.md
@@ -7,7 +7,6 @@ This repository contains resources for the Bitwarden brand such as logos, icons,
|
||||
- [Icon](/icons)
|
||||
- [Screenshots](/screenshots)
|
||||
- [Shield](/shield)
|
||||
- [Logos](/logos)
|
||||
|
||||
**For more brand resources visit [bitwarden.com/brand](https://bitwarden.com/brand/)**
|
||||
|
||||
@@ -17,7 +16,6 @@ This repository contains resources for the Bitwarden brand such as logos, icons,
|
||||
|---|---|
|
||||
| Default |  |
|
||||
| Inverse |  |
|
||||
| Black |  |
|
||||
|
||||
## Product Icon
|
||||
|
||||
@@ -40,42 +38,45 @@ This repository contains resources for the Bitwarden brand such as logos, icons,
|
||||
|
||||
## Product Screenshots
|
||||
|
||||

|
||||
|
||||
[View all product screenshots](/screenshots)
|
||||
|
||||
## Color Palettes
|
||||
|
||||
### Branding
|
||||
|
||||
| Web Colors | HEX value |
|
||||
|------------|-----------|
|
||||
| Primary Blue |  `#175DDC` |
|
||||
| Deep Blue |  `#1A41AC` |
|
||||
| Indigo Blue |  `#020F66` |
|
||||
| Accent Teal |  `#2CDDE9` |
|
||||
| Accent Melon |  `#FF4E63` |
|
||||
| Accent Yellow |  `#FFBF00` |
|
||||
| Accent Purple |  `#9D26FF` |
|
||||
| Accent Gray |  `#F3F6F9` |
|
||||
| Accent Black |  `#000000` |
|
||||
| Accent White |  `#FFFFFF` |
|
||||
| Web Colors | Color | HEX value |
|
||||
|------------|-----------|-----------|
|
||||
| Primary Blue |  | `#175DDC` |
|
||||
| Deep Blue |  | `#1A41AC` |
|
||||
| Indigo Blue |  | `#020F66` |
|
||||
| Accent Teal |  | `#2CDDE9` |
|
||||
| Accent Melon |  | `#FF4E63` |
|
||||
| Accent Yellow |  | `#FFBF00` |
|
||||
| Accent Purple |  | `#9D26FF` |
|
||||
| Accent Gray |  | `#F3F6F9` |
|
||||
| Accent Black |  | `#000000` |
|
||||
| Accent White |  | `#FFFFFF` |
|
||||
|
||||
| Grayscale | HEX value |
|
||||
|------------|-----------|
|
||||
| Deep Dark Gray |  `#282A31` |
|
||||
| Dark Gray |  `#6E7881` |
|
||||
| Deep Medium Gray |  `#939DA7` |
|
||||
| Medium Gray |  `#ABB4BD` |
|
||||
| Light Gray |  `#CFD4DA` |
|
||||
| Lightest Gray |  `#E6EBEF` |
|
||||
| Grayscale | Color | HEX value |
|
||||
|------------|-----------|-----------|
|
||||
| Deep Dark Gray |  | `#282A31` |
|
||||
| Dark Gray |  | `#6E7881` |
|
||||
| Deep Medium Gray |  | `#939DA7` |
|
||||
| Medium Gray |  | `#ABB4BD` |
|
||||
| Light Gray |  | `#CFD4DA` |
|
||||
| Lightest Gray |  | `#E6EBEF` |
|
||||
|
||||
| Product Colors | Color | HEX value |
|
||||
|------------|-----------|-----------|
|
||||
| Text |  | `#000000` |
|
||||
| Success |  | `#57C86B` |
|
||||
| Danger |  | `#E5544A` |
|
||||
| Warning |  | `#E8BF31` |
|
||||
| Info |  | `#63A2FD` |
|
||||
| Background |  | `#F3F6F9` |
|
||||
|
||||
| Product Colors | HEX value |
|
||||
|------------|-----------|
|
||||
| Text |  `#000000` |
|
||||
| Success |  `#57C86B` |
|
||||
| Danger |  `#E5544A` |
|
||||
| Warning |  `#E8BF31` |
|
||||
| Info |  `#63A2FD` |
|
||||
| Background |  `#F3F6F9` |
|
||||
|
||||
[Download color codes](/brand-colors/pallette.scss)
|
||||
|
||||
|
||||
Reference in New Issue
Block a user