The Birth of Geist: A Typeface Crafted for the Web
DATE
CATEGORY
Design
READ TIME
3 minutes
VIEWS
...The Birth of Geist: A Typeface Crafted for the Web
Collaborating with Vercel is always an exciting journey. They drive us to extend our capabilities and embrace new challenges, empowering us to set fresh benchmarks in the design world. Together, we’ve crafted Geist – a typeface that redefines visual communication.
Enter Geist: the new typeface/font of the web.
Origin: The Spark That Ignited Geist
Our design team had been dabbling in type design for months, and some of those early experiments crystallized into what we now proudly call Basement Foundry.
Initially created as part of basement’s visual identity, our custom typeface garnered significant attention and praise.
It became a hit among designers, leading us to think, "Why stop here?"
Fast forward to late 2022, and our long-time partner Vercel, approached us with a thrilling challenge. They wanted a bespoke typeface that would resonate with their brand values and integrate seamlessly into their visual identity. The kicker? It had to be a fully functional type family that included a monospaced font for their developer-centric audience and open-source, making it freely available to the whole community.
Crafting the Perfect Typeface
The first launch in early 2023 received an overwhelmingly positive response from the Vercel and Next.js community. While critics pointed out areas for improvement, their feedback was invaluable in raising the bar for future releases.
We knew the typeface had to be an extension of Vercel’s visual language. Here’s what we were aimed for:
Legibility: Clear and easy to read, even in small sizes.
Modern Aesthetic: Sleek and contemporary.
Techy Vibe: A nod to the digital world.
Consistency: Uniformity across various weights and styles.
We wanted to pay homage to the type designers who influenced us deeply. Geist had to echo the greatness of legendary typefaces like Univers, SF Mono, SF Pro, Inter, and Suisse International.
The letterforms of Geist are characterized by several key features, including a high x-height that enhances legibility across a range of sizes. Additionally, the design incorporates short descenders, along with angular strokes on specific terminals, elbows, and descender strokes, contributing to its distinct and functional appearance.
From Drafts to Approval
The initial drafts came together quickly. We started with a sans-serif font and soon developed the first versions of the monospaced glyphs. Our solid understanding of Vercel’s visual language helped secure swift approval and the green light to finalize the first version of the font.
Vercel’s feedback was instrumental throughout the design process, allowing us to refine and enhance the letterforms. Together, we expanded the typeface to include a full set of weights and additional glyphs, ensuring maximum versatility and alignment with Vercel's brand vision.
It’s important to mention that once the design process was coming to an end, we brought Guido Ferreyra, an amazing font developer, on board to help us make sure all the technical aspects of the typeface were on point. He joined Geist’s designers, Andrés Briganti and Mateo Zaragoza, giving thoughtful feedback and helping make the necessary adjustments where needed to meet the highest industry standards of type design and font development.
Tools and Timeline: Crafting with Precision
We primarily used the Glyphs app, which was a learning journey. The project timeline was meticulously planned to ensure we met every milestone, from initial drafts to the final launch.
Geist: Designed for Developers and Designers
At Vercel, Geist is specifically designed for developers and designers. We began with a Sans version, prioritizing readability and integration into coding environments.
Weights: 9
GlyphsSans: 825 / Mono: 852
Stylistic sets: 9
Languages: 368
After perfecting the Sans variant, we expanded Geist, adding versatility to its capabilities.
With precision, clarity, and functionality at its core, Geist enhances the visual experience for developers and designers, empowering them to effectively communicate their ideas.
Geist embodies our design principles of simplicity, minimalism, and speed, drawing inspiration from the renowned Swiss design movement.
"Geist truly represents the coding and design spirit within Vercel's creator community."
Bonus: Repercussions and Community Response
The response to Geist has been nothing short of phenomenal. People have embraced and used the typeface in ever-increasing numbers, and every day we’re pleasantly surprised by the creative applications from the community. This widespread adoption and innovative usage have proven Geist’s versatility and quality.