From 7979cf1f8cbef6cca8e8ea39d9a7e92379dda3a4 Mon Sep 17 00:00:00 2001 From: DanHillesheim <79476558+DanHillesheim@users.noreply.github.com> Date: Tue, 23 Apr 2024 10:50:12 -0600 Subject: [PATCH] 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 --- README.md | 61 ++++++++++++++++++++++++++++--------------------------- 1 file changed, 31 insertions(+), 30 deletions(-) diff --git a/README.md b/README.md index d81a524..f1070be 100644 --- a/README.md +++ b/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 | ![Default](/logos/logo-horizontal-blue.svg) | | Inverse | ![Inverse](/logos/logo-horizontal-white.svg) | -| Black | ![Black](/logos/logo-horizontal.svg) | ## Product Icon @@ -40,42 +38,45 @@ This repository contains resources for the Bitwarden brand such as logos, icons, ## Product Screenshots +![Bitwarden App Screenshot](/screenshots/apps-combo.png) + [View all product screenshots](/screenshots) ## Color Palettes ### Branding -| Web Colors | HEX value | -|------------|-----------| -| Primary Blue | ![#175DDC](https://www.singlecolorimage.com/get/175DDC/32x32) `#175DDC` | -| Deep Blue | ![#1A41AC](https://www.singlecolorimage.com/get/1A41AC/32x32) `#1A41AC` | -| Indigo Blue | ![#020F66](https://www.singlecolorimage.com/get/020F66/32x32) `#020F66` | -| Accent Teal | ![#2CDDE9](https://www.singlecolorimage.com/get/2CDDE9/32x32) `#2CDDE9` | -| Accent Melon | ![#FF4E63](https://www.singlecolorimage.com/get/FF4E63/32x32) `#FF4E63` | -| Accent Yellow | ![#FFBF00](https://www.singlecolorimage.com/get/FFBF00/32x32) `#FFBF00` | -| Accent Purple | ![#9D26FF](https://www.singlecolorimage.com/get/9D26FF/32x32) `#9D26FF` | -| Accent Gray | ![#F3F6F9](https://www.singlecolorimage.com/get/F3F6F9/32x32) `#F3F6F9` | -| Accent Black | ![#000000](https://www.singlecolorimage.com/get/000000/32x32) `#000000` | -| Accent White | ![#FFFFFF](https://www.singlecolorimage.com/get/FFFFFF/32x32) `#FFFFFF` | +| Web Colors | Color | HEX value | +|------------|-----------|-----------| +| Primary Blue | ![#175DDC](https://www.singlecolorimage.com/get/175DDC/32x32) | `#175DDC` | +| Deep Blue | ![#1A41AC](https://www.singlecolorimage.com/get/1A41AC/32x32) | `#1A41AC` | +| Indigo Blue | ![#020F66](https://www.singlecolorimage.com/get/020F66/32x32) | `#020F66` | +| Accent Teal | ![#2CDDE9](https://www.singlecolorimage.com/get/2CDDE9/32x32) | `#2CDDE9` | +| Accent Melon | ![#FF4E63](https://www.singlecolorimage.com/get/FF4E63/32x32) | `#FF4E63` | +| Accent Yellow | ![#FFBF00](https://www.singlecolorimage.com/get/FFBF00/32x32) | `#FFBF00` | +| Accent Purple | ![#9D26FF](https://www.singlecolorimage.com/get/9D26FF/32x32) | `#9D26FF` | +| Accent Gray | ![#F3F6F9](https://www.singlecolorimage.com/get/F3F6F9/32x32) | `#F3F6F9` | +| Accent Black | ![#000000](https://www.singlecolorimage.com/get/000000/32x32) | `#000000` | +| Accent White | ![#FFFFFF](https://www.singlecolorimage.com/get/FFFFFF/32x32) | `#FFFFFF` | -| Grayscale | HEX value | -|------------|-----------| -| Deep Dark Gray | ![#282A31](https://www.singlecolorimage.com/get/282A31/32x32) `#282A31` | -| Dark Gray | ![#6E7881](https://www.singlecolorimage.com/get/6E7881/32x32) `#6E7881` | -| Deep Medium Gray | ![#939DA7](https://www.singlecolorimage.com/get/939DA7/32x32) `#939DA7` | -| Medium Gray | ![#ABB4BD](https://www.singlecolorimage.com/get/ABB4BD/32x32) `#ABB4BD` | -| Light Gray | ![#CFD4DA](https://www.singlecolorimage.com/get/CFD4DA/32x32) `#CFD4DA` | -| Lightest Gray | ![#E6EBEF](https://www.singlecolorimage.com/get/E6EBEF/32x32) `#E6EBEF` | +| Grayscale | Color | HEX value | +|------------|-----------|-----------| +| Deep Dark Gray | ![#282A31](https://www.singlecolorimage.com/get/282A31/32x32) | `#282A31` | +| Dark Gray | ![#6E7881](https://www.singlecolorimage.com/get/6E7881/32x32) | `#6E7881` | +| Deep Medium Gray | ![#939DA7](https://www.singlecolorimage.com/get/939DA7/32x32) | `#939DA7` | +| Medium Gray | ![#ABB4BD](https://www.singlecolorimage.com/get/ABB4BD/32x32) | `#ABB4BD` | +| Light Gray | ![#CFD4DA](https://www.singlecolorimage.com/get/CFD4DA/32x32) | `#CFD4DA` | +| Lightest Gray | ![#E6EBEF](https://www.singlecolorimage.com/get/E6EBEF/32x32) | `#E6EBEF` | + +| Product Colors | Color | HEX value | +|------------|-----------|-----------| +| Text | ![#000000](https://www.singlecolorimage.com/get/000000/32x32) | `#000000` | +| Success | ![#57C86B](https://www.singlecolorimage.com/get/57C86B/32x32) | `#57C86B` | +| Danger | ![#E5544A](https://www.singlecolorimage.com/get/E5544A/32x32) | `#E5544A` | +| Warning | ![#E8BF31](https://www.singlecolorimage.com/get/E8BF31/32x32) | `#E8BF31` | +| Info | ![#63A2FD](https://www.singlecolorimage.com/get/63A2FD/32x32) | `#63A2FD` | +| Background | ![#F3F6F9](https://www.singlecolorimage.com/get/F3F6F9/32x32) | `#F3F6F9` | -| Product Colors | HEX value | -|------------|-----------| -| Text | ![#000000](https://www.singlecolorimage.com/get/000000/32x32) `#000000` | -| Success | ![#57C86B](https://www.singlecolorimage.com/get/57C86B/32x32) `#57C86B` | -| Danger | ![#E5544A](https://www.singlecolorimage.com/get/E5544A/32x32) `#E5544A` | -| Warning | ![#E8BF31](https://www.singlecolorimage.com/get/E8BF31/32x32) `#E8BF31` | -| Info | ![#63A2FD](https://www.singlecolorimage.com/get/63A2FD/32x32) `#63A2FD` | -| Background | ![#F3F6F9](https://www.singlecolorimage.com/get/F3F6F9/32x32) `#F3F6F9` | [Download color codes](/brand-colors/pallette.scss)