(Rainbow) Flag Font Friday

In-person LGBTQIA+ celebrations may be cancelled this year, but a new(ish) typeface can soothe your wounds with rainbow colored curves and strokes. Behold: the typeface “Gilbert.”

[Update] I’m getting some formatting errors in this post, so here’s a link to the original article: https://www.typewithpride.com/

On 31 March, 2017, Gilbert Baker, the creator of the iconic Rainbow Flag, sadly passed away. Mr. Baker was both an LGBTQ activist and artist, and was known for helping friends create banners for protests and marches. To honor the memory of Gilbert Baker, NewFest and NYC Pride partnered with Fontself to create a free font inspired by the design language of the iconic Rainbow Flag, the font was named ‘Gilbert’ after Mr. Baker. A preview version of the font can be downloaded for free in the download section.

(Videos, animations and lots more type specimens at https://www.typewithpride.com/.)

Download Gilbert


The Gilbert font was originally designed for striking headlines and statements that could live on banners for rallies and protests and it is now currently being built out into a whole family of weights and styles. The font is available in two versions, a standard vector font and a color font (in OpenType-SVG format) currently usable in Photoshop CC 2017, Illustrator CC 2018, InDesign CC 2019 and above. Both fonts are early beta previews that you can download below for free, and you can follow @TypeWithPride on Instagram and on our development blog for news about new font weights, styles and creative contests.

Learn more about color fonts on Fontself’s dedicated website: colorfonts.wtf

NEW: now includes Katakana characters

Use Gilbert on your smartphone

You can even use the Gilbert font on your smartphone thanks to the Fontself free app that includes other creative fonts. It lets you share iconic messages & posts with your friends.


Use Gilbert on any website

Gilbert can be displayed on any web page thanks to a web font version, hosted on Fontself Catapult.

[While this color font looks great on Safari & Firefox, Google Chrome does NOT display colorful letters yet—only black glyphs will be displayed there. You can learn more about compatibilities on colorfonts.wtf.]

  1. Copy & paste this code in the <head> of your HTML page:
    <link href=”https://fonts.fontself.com/gE309jx/gilbert-color-bold-preview5.css” rel=”stylesheet”>
  2. Or add this line to your CSS:
    @import url(‘https://fonts.fontself.com/gE309jx/gilbert-color-bold-preview5.css’);
    Apply the font family gilbert-color-bold-preview5 to CSS elements:
    h1 { font-family: ‘gilbert-color-bold-preview5‘; }
    Or insert the class fs-gilbert-color-bold-preview5 into HTML elements:
    <h1 class=”fs-gilbert-color-bold-preview5“>This is Gilbert Color!</h1>

Download Gilbert Animated


Type with Pride partnered with Animography to create Gilbert Animated, a motion-ready typography resource designed for animation, film, video, social posts, GIFs and much more. The free animated font is useable in Adobe After Effects. Find out more at animography.net

Gilbert Baker was both an LGBTQ activist and artist, and was known for helping friends create banners for protests and marches. In the spirit of Mr. Baker’s creative and collaborative nature, we’ve created free downloadable art intended to be printed and held high at pride events, protests and rallies.

Download Art

This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License