Fonts
The fonts duolingo.com uses
duolingo.com sets its headlines and body text in duolingo-sans. duolingo-sans is loaded by the site itself. The closest free match on Google Fonts: Inter.
Measured from duolingo.com 4 days ago.
Font families
2 families- Used for
- h1, body, button
- Source
- stand-in Inter
- Free alternative
- Inter
- Used for
- h2
- Source
- stand-in Inter
- Free alternative
- Inter
CSS to reproduce it
Font variables with the free stand-in in the stack, so the same CSS works with or without the licensed font.
:root {
--font-heading: "duolingo-sans", "Inter", sans-serif; /* Inter stands in for duolingo-sans */
--font-body: "duolingo-sans", "Inter", sans-serif; /* Inter stands in for duolingo-sans */
--font-size-base: 17px;
}How the type is set
For AI agents
The pack is plain text, no key: fetch DESIGN.md, or hand the whole pack to Claude Code, Cursor or Copilot with the MCP server.
curl -s https://stylepack.ai/packs/duolingo.com/DESIGN.mdQuestions
What font does duolingo.com use?
duolingo.com uses duolingo-sans, feather. Headlines are set in duolingo-sans and body text in duolingo-sans, measured from the site as it renders, not read from its stylesheet.
Is the duolingo.com font free to use?
No. duolingo-sans is a licensed font that duolingo.com serves itself. The closest free match is Inter, available on Google Fonts. The CSS on this page puts it in the font stack as the stand-in.
How do I get the same typography as duolingo.com in my project?
Download the duolingo.com design pack from Stylepack: it holds the font stack, the type scale, every text style and the screenshots, in a form an AI coding agent such as Claude Code or Cursor can build from.