Below is an overview of key brand assets of the Mozilla Foundation for agencies, contractors, and external stakeholders. A more in-depth overview of the Foundation brand can be found here.
Colors
Color palettes are for the Mozilla Foundation, Privacy Not Included, and Mozilla Festival. Sketch and Adobe palettes can be downloaded below. Complete RGB and HEX codes are here.
Typography
Zilla Slab and Zilla Slab Highlight are our core typefaces. We use Zilla for our wordmark, for headlines, and throughout our designs. Nunito Sans is our primary san-serif type pairing as it has similar x-heights, axis and shape of characters to compliment Zilla Slab. More documentation on our typography is here.
Zilla Slab, Zilla Slab Highlight & Nunito Sans are all open-source fonts.
Image Template
The .ai image template can be downloaded here and offers image sizes and export instructions for the various Mozilla Foundation social, foundation site, and blog needs.
Image sizes (in pixels)
Social Media
Gridpost, 1080 x 1080 (1:1)
Story, 1080 x 1920
Timeline post, 1200 x 675 (16:9)
Ad spec, 1000 x 1500 (2:3)
OG Share Image
General post, 1200 x 628
Mozilla Foundation Site
Hero Image, 4032 x 480
Page banner, 1984 x 567
Large feature/ thumbnail, 800 x 450
Spotlight, 540 x 400
16:9 Image,1600 x 900
16:6 Image, 1600 x 600
Text with image 1:1, 300 x 300
Text with small image, 100 x 100
Email header, 1280 x 445
Image, 500 x 500
Blog
Blog header, 1080 x 564
16:9 Image, 1600 x 900
16:6 Image, 1600 x 600
Article Page
2X Images, 444 x 325.95
Wide Image, 1440 x custom height, default is 410
Image, 920 or full width of content div x custom height, no default
Images in Content, Variable: works to fit uploaded graphic
mozilla.org
Content cards (S/M/L), 1200 x 800
