Nuxt.com is the main entry point when you want to learn Nuxt. With more than 300k visitors every month, it was time to give it a new look and feel.
New Design
We are back to the original colors of Nuxt, with a navy background (#020420) and its signature shiny green (#00DC82).
We wanted to achieve a consistent design across all our official documentations:
We really love this new design and hope you do too. This is only the first step toward many improvements coming to the website.
Improved Navigation
From now on, you can easily jump between the five main documentation categories:
On the right side, you can see the table of contents as well as community shortcuts: Edit this page, Chat on Discord, etc.
Source Code Buttons
When looking at Nuxt built-in components, composables, utils, commands and kit utilities, you can now jump to the source code by clicking on the button.
Improved Search Feature
You may notice a new modal when hitting K. We leverage the Nuxt UI <CommandPalette> components combined with Nuxt Content data (search & navigation) to provide a better search experience.
With the command palette, you can:
- Jump to a page
- Search in the documentation
- Search a module
- Switch the color mode
We plan to add more commands soon.
Migration to Nuxt UI
The new website is powered by Nuxt UI, our UI library tailored made for Nuxt and built on top of Tailwind CSS & Headless UI.
The website also uses Nuxt UI Pro, a set of premium components built on top of Nuxt UI to create beautiful & responsive Nuxt applications in minutes.
It includes components such as <UHeader>, <UFooter>, <ULandingHero>, <ULandingCard> and more.
This migration was a great opportunity to improve Nuxt UI & UI Pro and fix some bugs, as well as a difference of +9,004 / -23,113 lines of code changed.
Open Graph Images
We are big fans of having a custom image when we share a link on social media. That's why we have added OG images on all our documentation pages.
Example of the Installation page:
Available on GitHub
We are proud to announce that the website is now open source and available on GitHub.
What's next?
This new website is the beginning of upcoming changes we are planing, some of them are:
- Team & Contributors pages
- Integrations page to showcase all the possibilities with Nuxt: Hosting, CMS, Database, etc.
- Templates page (currently nuxt.new) to list official and community starters
- And more...
We are looking forward to your feedback on Twitter, Discord or GitHub.
Thank you for reading this blog post, and happy Nuxting 🤟