alawonn
A circular, sculpted display typeface with a cursive feel. Use it for headings, names and short lines of display text.
npm install alawonn-font
Try it
Sizes
- 20 pxMorning light on the open water
- 32 pxMorning light on the open water
- 48 pxMorning light on the water
- 72 pxOpen water
- 144 pxCalm
Alphabet
ABCDEFGHIJKLM
NOPQRSTUVWXYZ
abcdefghijklm
nopqrstuvwxyz
Figures, punctuation and symbols
Figures
0123456789
Tabular figures
1111
0000
Punctuation
. , : ; ! ? ¡ ¿ … · • ‘ ’ “ ” ‚ „ « » ‹ › - – — ( ) [ ] { } / \ | ¦ & @ # * † ‡ § ¶ _
Currency and math
$ ¢ £ ¤ ¥ € ƒ % ‰ + − × ÷ = ≠ < > ≤ ≥ ± ¬ ≈ ° ½ ¼ ¾ ¹ ² ³ © ® ™
Accents
Accented capitals and lowercase for Western, Central and Eastern European languages, Turkish, the Baltic languages and Haitian Creole.
Ångström Łódź Garçon Güneş Ľubica Őrség Žemaitė Ħamrun Ærø Țară Šibenik Ēriks
Combining accents
The 15 combining accents attach to any letter and stack on top of each other.
- x́x + acute
- q̃q + tilde
- m̄m + macron
- ǘu + diaeresis + acute
- i̋i + double acute
- k̦k + comma below
Every character
Install
npm install alawonn-font
Use it
Import the package once, in your app's entry file or root layout:
import "alawonn-font";
Then set the family:
font-family: "Alawonn", cursive;
This works with React, Vue, Svelte, Astro and Next.js. In Nuxt, add "alawonn-font" to css in nuxt.config.ts. In React Native, load alawonn-font/dist/Alawonn-Regular.ttf with expo-font.
No build step
Link the stylesheet from a CDN:
Desktop apps
Download the TTF and install it. On Windows, right-click and choose Install. On a Mac, open it and choose Install in Font Book. It appears as Alawonn in your font menu.