{"@context":"https://schema.org","@graph":[{"@type":"TechArticle","headline":"Inertia.js","description":"Ready to give your Inertia.js project that sleek, dark mode look? Check out this guide to get your app looking smooth and stylish in the dark.","url":"https://intentui.com/docs/dark-mode/inertia-js","author":{"@type":"Person","name":"Irsyad","url":"https://x.com/irsyad"},"publisher":{"@type":"Organization","name":"Intent UI","url":"https://intentui.com","logo":{"@type":"ImageObject","url":"https://intentui.com/icon.svg"}},"mainEntityOfPage":{"@type":"WebPage","@id":"https://intentui.com/docs/dark-mode/inertia-js"}},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://intentui.com"},{"@type":"ListItem","position":2,"name":"Docs","item":"https://intentui.com/docs"},{"@type":"ListItem","position":3,"name":"Dark mode","item":"https://intentui.com/docs/dark-mode"},{"@type":"ListItem","position":4,"name":"Inertia.js","item":"https://intentui.com/docs/dark-mode/inertia-js"}]}]}
Dark mode
Inertia.js
Ready to give your Inertia.js project that sleek, dark mode look? Check out this guide to get your app looking smooth and stylish in the dark.
First of all, let's create a folder called providers inside the resources/js directory. Inside this folder, create a file called theme-provider.tsx. After that, you of course need a switcher right, so create a file called theme-switcher.tsx inside the Components folder. So your folder structure now is like this: