Skip to content

Conversation

praizjosh
Copy link
Contributor

@praizjosh praizjosh commented Apr 9, 2025

Closes: #75384
Closes: #77883

Motivation

The current documentation for adding next/font to Tailwind CSS is now obsolete as it gives examples applicable to Tailwind v3 such as updating the Tailwind CSS config file, which is quite outdated since the inception of Tailwind v4.

Based on the newer way of configuring Tailwind, the doc has been updated with steps for adding next/font to Tailwind CSS v4 including relevant examples.

Before:

Screenshot 2025-04-09 at 11 24 31 am

After:

Screenshot 2025-04-09 at 11 22 23 am

Updated the doc with steps for adding `next/font` to Tailwind CSS v4 with examples.
@ijjk ijjk added Documentation Related to Next.js' official documentation. Font (next/font) Related to Next.js Font Optimization. labels Apr 9, 2025
@ijjk
Copy link
Member

ijjk commented Apr 9, 2025

Allow CI Workflow Run

  • approve CI run for commit: 18d1c1c

Note: this should only be enabled once the PR is ready to go and can only be enabled by a maintainer

@praizjosh praizjosh changed the title Update 03-fonts.mdx [docs] Update 03-fonts.mdx Apr 9, 2025
@praizjosh
Copy link
Contributor Author

Hi @ijjk you might what to have a look at this pull request. Cheers!

Copy link
Contributor

@delbaoliveira delbaoliveira left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you @praizjosh 🙏🏼

@delbaoliveira delbaoliveira enabled auto-merge (squash) April 15, 2025 13:31
@ijjk ijjk disabled auto-merge April 16, 2025 02:35
@ijjk ijjk enabled auto-merge (squash) April 16, 2025 02:35
@ijjk ijjk merged commit ddca498 into vercel:canary Apr 16, 2025
43 checks passed
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Apr 30, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Documentation Related to Next.js' official documentation. Font (next/font) Related to Next.js Font Optimization. locked
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Docs: Only TailwindCSS v3-compatible instructions are available for adding a font Docs: Outdated tailwind docs for the tailwind v4 release
3 participants