diff --git a/BRAND.md b/BRAND.md new file mode 100644 index 0000000000000000000000000000000000000000..c3357013ba8290d904964c74b01f0b5fabf2c299 --- /dev/null +++ b/BRAND.md @@ -0,0 +1,56 @@ +# Fevermap branding guidelines and material + +## Fevermap official spelling and tagline + +The official spelling is **Fevermap**. In logo the spelling is all in capitals: FEVERMAP. + +The official tagline is **Infection tracking**. As such it is not identifiable, so it should be used with the Fevermap name. + +## Fevermap official colors +The official color palette: +![Color palette](images/palette/ColourPaletteFonts.png) + +The color palette is available in [pdf](images/palette/ColourPaletteFonts.pdf). +And in [SCSS](images/palette/palette.scss). + +The basic usage of the colors: + +**Maximum Blue Green**: links, buttons, active elements + +**Amaranth Deep Purple**: main background behind cards + +**White**: cards, navbar, button text, language selector bg + +**Dark Gunmetal**: text, light button / language selector text + +## Fevermap official fonts +The official fonts: **Nunito Bold, Karla Regular, Karla Bold** + +## Fevermap official logo + +The official logo in svg: +![Official logo](app/src/assets/images/fever_map-logo-text.svg) + +Logo with tagline in svg: +![Logo with tagline](app/src/assets/images/fever_map-logo-text-slogan.svg) + +## Fevermap official icons + +The official icon in svg: +![Official icon](app/src/assets/images/fever_map-logo.svg) + +The official inverted round icon in svg: +![Inverted round icon](app/src/assets/images/fever_map-logo-inverted-round.svg) + +Icons in different png sizes can be found [here](app/src/assets/images/). + +## Fevermap official cover images + +The official cover images with and without the name and tagline: + +![Cover image with logo](images/cover/cover-logo@4x.png) +![Cover image without logo](images/cover/cover-no-logo@4x.png) + + + + diff --git a/app/src/assets/images/fever_map-logo-inverted-round.svg b/app/src/assets/images/fever_map-logo-inverted-round.svg index e8a0e6815cb055ff33c2270a4d91dfe6d2e6bba6..987b7ca9038f893299cfd8ad68f906b32a06d06b 100644 --- a/app/src/assets/images/fever_map-logo-inverted-round.svg +++ b/app/src/assets/images/fever_map-logo-inverted-round.svg @@ -1,18 +1 @@ - - - - - - - - - - - - - - - - - - +fever_map-logo-inverted-round \ No newline at end of file diff --git a/app/src/assets/images/fever_map-logo-text-slogan.svg b/app/src/assets/images/fever_map-logo-text-slogan.svg index 12a01cfc7910c95aeed9cea6097bac92045f0c08..0f5c341b403207db66a1e6aaea79fb79aaffd194 100644 --- a/app/src/assets/images/fever_map-logo-text-slogan.svg +++ b/app/src/assets/images/fever_map-logo-text-slogan.svg @@ -1,51 +1 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - +fever_map-logo-text-slogan \ No newline at end of file diff --git a/app/src/assets/images/fever_map-logo-text.svg b/app/src/assets/images/fever_map-logo-text.svg index 2106abc282c3c5cddd18c94405c69b31452ca99a..f4c17236604a877ef49afabfc07ba9d250ce0e38 100644 --- a/app/src/assets/images/fever_map-logo-text.svg +++ b/app/src/assets/images/fever_map-logo-text.svg @@ -1,34 +1 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - +fever_map-logo-text \ No newline at end of file diff --git a/app/src/assets/images/fever_map-logo.svg b/app/src/assets/images/fever_map-logo.svg index 7523915de150a9731f3e182f8d7ad18d0f377154..303c1066399991309b702058e1a8b67e699d7ae2 100644 --- a/app/src/assets/images/fever_map-logo.svg +++ b/app/src/assets/images/fever_map-logo.svg @@ -1,26 +1 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - +fever_map-logo \ No newline at end of file diff --git a/images/cover/cover-logo@4x.png b/images/cover/cover-logo@4x.png new file mode 100644 index 0000000000000000000000000000000000000000..35cf49041630c135176ea00e3c57de035acfccde Binary files /dev/null and b/images/cover/cover-logo@4x.png differ diff --git a/images/cover/cover-no-logo@4x.png b/images/cover/cover-no-logo@4x.png new file mode 100644 index 0000000000000000000000000000000000000000..46251d5b58da0e18cbe6facd846e5786c629cfb4 Binary files /dev/null and b/images/cover/cover-no-logo@4x.png differ diff --git a/images/palette/ColourPaletteFonts.pdf b/images/palette/ColourPaletteFonts.pdf new file mode 100644 index 0000000000000000000000000000000000000000..859a57335087866a2246baa143f4b6d053447b31 Binary files /dev/null and b/images/palette/ColourPaletteFonts.pdf differ diff --git a/images/palette/ColourPaletteFonts.png b/images/palette/ColourPaletteFonts.png new file mode 100644 index 0000000000000000000000000000000000000000..eab40e127c38145349200984c3ead5e887b7c4d3 Binary files /dev/null and b/images/palette/ColourPaletteFonts.png differ diff --git a/images/palette/palette.scss b/images/palette/palette.scss new file mode 100644 index 0000000000000000000000000000000000000000..33235c6bb22ef4960445d37360a3694ab9bb71f5 --- /dev/null +++ b/images/palette/palette.scss @@ -0,0 +1,29 @@ +/* HEX */ +$bluegreen: #30BFBF; + $bluegreendarker: #259393; +$deeppurple: #9F2B68; + $deeppurpledarker: #852457; +$white: #FFFFFF; + $lightgray: #E5E5E5; +$gunmetal: #1F262A; + $dark: #0B0E0F; + +/* RGB */ +$bluegreen: rgb(48, 191, 191); + $bluegreendarker: rgb(37, 147, 147); +$deeppurple: rgb(159, 43, 104); + $deeppurpledarker: rgb(133, 36, 87); +$white: rgb(255, 255, 255); + $lightgray: rgb(229, 229, 229); +$gunmetal: rgb(31, 38, 42); + $dark: rgb(11, 14, 15); + +/* HSL */ +$bluegreen: hsl(180, 59.83%, 46.86%); + $bluegreendarker: hsl(180, 59.78%, 36.08%); +$deeppurple: hsl(328.45, 57.43%, 39.61%); + $deeppurpledarker: hsl(328.45, 57.4%, 33.14%); +$white: hsl(0, 0%, 100%); + $lightgray: hsl(0, 0%, 89.8%); +$gunmetal: hsl(201.82, 15.07%, 14.31%); + $dark: hsl(195, 15.38%, 5.1%);