Install FontSwap
Almendra
About Almendra
- Source
- Google Fonts ↗
- Classification
- display
- Weights
- 400, 700
- Features
- Italics
Free to use, modify, and distribute. Can be used commercially without attribution.
What's allowed?
- ✓ Client work
- ✓ SaaS / Web apps
- ✓ YouTube / Video
- ✓ Sell products
- ✓ Print materials
Note: Derivative fonts must use the same license.
Full license guide →Almendra is a calligraphic display typeface designed by Ana Sanfelippo that blends gothic influence with Renaissance calligraphic forms. The design draws on the historical intersection between blackletter and humanist writing traditions, producing letterforms that carry medieval weight and character while incorporating the flowing curves of calligraphic construction.
History and Design
Ana Sanfelippo created Almendra as a typeface that bridges the gap between strict blackletter and classical calligraphy. The design references the period when European scribes were transitioning from angular gothic scripts toward the rounder humanist forms that would eventually replace blackletter in most of Western Europe. This transitional quality gives Almendra a unique character — recognizably gothic in its weight and angularity, yet more flowing and organic than traditional blackletter.
The letterforms feature pointed serifs, calligraphic stroke modulation, and the kind of angular construction associated with gothic manuscript traditions. However, the curves are smoother and the proportions more open than strict blackletter, making the typeface more accessible to contemporary readers. Available in regular and bold weights with matching italics, Almendra offers more typographic flexibility than many single-weight blackletter alternatives.
Best For
- Fantasy and medieval-themed creative projects
- Book cover design for historical fiction and period literature
- Heritage branding with calligraphic elegance
- Invitation and stationery design requiring gothic refinement
- Decorative display where blackletter spirit meets calligraphic grace
Tips
Almendra's two weights (regular and bold) with italics provide more versatility than most blackletter alternatives. Use the regular weight for longer display text and the bold for primary headlines. The italic style adds calligraphic expressiveness suitable for accent text and pull quotes. The typeface's hybrid character makes it more readable than pure blackletter, allowing use at smaller display sizes. Pair with a traditional serif for body text to maintain the historical aesthetic.
Is Almendra on Google Fonts?
Yes, Almendra is available for free on Google Fonts. Get Almendra on Google Fonts ↗
Alternative For (3)
Almendra is a free alternative to the following premium fonts:
Compare Almendra
See how Almendra compares to other fonts side by side.
Font Pairings
Fonts that pair well with Almendra based on contrast and complementary design characteristics.
Performance
Key metrics for evaluating Almendra in production.
Font Metrics
Fallback CSS Overrides
Apply these overrides to Arial to minimize layout shift when loading Almendra.
@font-face {
font-family: 'Almendra Fallback';
src: local('Arial');
ascent-override: 95.1%;
descent-override: 34.5%;
line-gap-override: 0%;
size-adjust: 99.12%;
}How to Use Almendra
Copy these code snippets to quickly add Almendra to your project.
CSS code for Almendra
@import url('https://fonts.googleapis.com/css2?family=Almendra:wght@400;700&display=swap');HTML code for Almendra
<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=Almendra:wght@400;700&display=swap" rel="stylesheet">Tailwind code for Almendra
// tailwind.config.js
module.exports = {
theme: {
extend: {
fontFamily: {
'almendra': ['Almendra', 'sans-serif'],
},
},
},
}
// Usage in HTML:
// <p class="font-almendra">Your text here</p>Next.js code for Almendra
// Using next/font (Next.js 13+)
import { Almendra } from 'next/font/google';
const almendra = Almendra({
subsets: ['latin'],
weight: ['400', '700'],
});
export default function Component() {
return (
<p className={almendra.className}>
Your text here
</p>
);
}
// Or using inline styles with Google Fonts link:
// <p style={{ fontFamily: "'Almendra'" }}>Your text</p>Expo and React Native code for Almendra
// Install: npx expo install @expo-google-fonts/almendra expo-font
import { useFonts, Almendra_400Regular } from '@expo-google-fonts/almendra';
export default function App() {
const [fontsLoaded] = useFonts({
Almendra_400Regular,
});
if (!fontsLoaded) return null;
return (
<Text style={{ fontFamily: 'Almendra_400Regular' }}>
Your text here
</Text>
);
}