Mulish
About Mulish
- Source
- Google Fonts ↗
- Classification
- sans-serif
- Weights
- Variable (100-900)
- Features
- Variable, Italics
Mulish (formerly Muli) is a minimalist geometric sans-serif typeface designed by Vernon Adams. With its clean lines and wide character set, it provides a modern alternative to classic geometric fonts while offering excellent screen rendering and variable font technology.
History and Design
Vernon Adams originally designed Muli as a minimalist display font. The typeface was later renamed to Mulish when it was expanded to include Cyrillic support and updated with variable font capabilities. The redesign maintained the original's clean geometric character while improving its versatility for both display and text use.
Mulish features a tall x-height and open apertures, optimizing it for screen readability without sacrificing the geometric precision that defines its character.
Why Mulish Stands Out
Mulish combines the clean aesthetic of Century Gothic with modern technical features. Its variable font format allows precise weight control, making it adaptable to responsive design needs. The extended language support and comprehensive weight range make it practical for international projects requiring typographic flexibility.
Technical Features
- Variable font: Weight axis from 200 to 900
- 9 static weights: ExtraLight to Black with italics
- Cyrillic support: Full Russian and related alphabets
- Vietnamese: Extended Latin for Southeast Asian languages
- OpenType features: Stylistic alternates, fractions, and case-sensitive punctuation
Best Use Cases
Mulish excels in:
- Modern web design: Clean interface typography
- Multilingual websites: Latin, Cyrillic, and Vietnamese support
- Startup branding: Contemporary geometric aesthetic
- Document design: Professional presentations and reports
Usage Tips
The variable font version of Mulish enables fine-tuned weight adjustments—try 350 for slightly emphasized body text or 650 for subheadings that need extra presence. At large display sizes, the lighter weights (200-300) create elegant, sophisticated headlines. For body text, stick to 400-500 at 16px or larger. Mulish pairs well with more expressive display fonts or can serve as a complete typographic system on its own.
Alternative For (1)
Mulish is a free alternative to the following premium fonts:
How to Use Mulish
Copy these code snippets to quickly add Mulish to your project.
CSS Import
@import url('https://fonts.googleapis.com/css2?family=Mulish:wght@100..900&display=swap');HTML Link Tags
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Mulish:wght@100..900&display=swap" rel="stylesheet">Tailwind CSS
// tailwind.config.js
module.exports = {
theme: {
extend: {
fontFamily: {
'mulish': ['Mulish', 'sans-serif'],
},
},
},
}
// Usage in HTML:
// <p class="font-mulish">Your text here</p>React / Next.js
// Using next/font (Next.js 13+)
import { Mulish } from 'next/font/google';
const mulish = Mulish({
subsets: ['latin'],
weight: ['100', '200', '300', '400', '500', '600', '700', '800', '900'],
});
export default function Component() {
return (
<p className={mulish.className}>
Your text here
</p>
);
}
// Or using inline styles with Google Fonts link:
// <p style={{ fontFamily: "'Mulish'" }}>Your text</p>