ab-nextjs-fonts
v0.2.2TypeScript
āļø A lightweight collection of React fonts created by Abraham Ukachi, and optimized for Next.js applications š.
0/weekUpdated 4 months agoMITUnpacked: 9.9 MB
Published by Abraham Ukachi
npm install ab-nextjs-fonts
ab-nextjs-fonts
> IMPORTANT: This is a work in progress and subject to major changes until version 1.0.
āļø This is a lightweight collection of React fonts created by Abraham Ukachi, and optimized for Next.js applications š.
Getting Started
$3
#### npm
``bash`
npm i ab-nextjs-fonts
#### pnpm
`bash`
pnpm install ab-nextjs-fonts
---
Fonts
A list of all the supported fonts and their current status:
| No. | Name | Status |
|:----|:-----|:-------|
| 1 | Inter | Done |
| 2 | Mulish | Done |
| 3 | Quicksand | Done |
| 4 | Roboto | Done |
| 5 | ZillaSlab | Done |
> NOTE: These fonts are also available offline ;) See ab-nextjs-theme/typography for more details.
$3
Use font-inter-* tailwindcss utilities to apply the Inter font to your nextjs/react component:
` ... ... ...tsx`or
or
$3
Use font-mulish-* tailwindcss utilities to apply the Mulish font to your nextjs/react component:
` ... ... ...tsx`or
or
$3
Use font-quicksand-* tailwindcss utilities to apply the Quicksand font to your nextjs/react component:
` ... ... ...tsx`or
or
$3
Use font-roboto-* tailwindcss utilities to apply the Roboto font to your nextjs/react component:
` ... ... ...tsx`or
or
$3
Use font-zillaslab-* tailwindcss utilities to apply the ZillaSlab font to your nextjs/react component:
` ... ... ...tsx`or
or
TODOs
- [ ] Optimize all fonts
- [ ] Add the Sacramento font
- [ ] Add a Nerd Font font (for easy icon support)
Learn More abElements
To learn more about abElements, take a look at the following resources:
- abElements Documentation - learn about abElements features and API.abElements
- abElements Animations - learn about animations in .abElements
- abElements Core - learn about core in .abElements
- abElements Theme - learn about theme in .abElements
- abElements Icons - learn about icons in .abElements
- abElements Components - learn about components in . abElements
- abElements Fonts - learn about fonts in . abElements
- abElements Hooks - learn about hooks in .
You can check out the abElements GitHub repository for more details.
License
This ab-nextjs-fonts` project is MIT Licensed ;)