DEV Community

Darshan J
Darshan J

Posted on

Three ways to Theme a React App

Whether it might be to let the user toggle between light & dark themes or let them choose one of the many color themes, themes make websites better.

Here are 3 ways I found to theme a React App:

Using CSS Variables

This one is fairly simple and can also enable you to add themes quite easily event after you built your website without considering adding theme. This method isn't event restricted to just React apps, you can even use this method to theme a Vanilla JS app.

Github link

Theming with React.js or any in minutes with CSS Variables by Harish V

Using React Context

This one was hard for me to get it to work.
Here's how I got it to work
Unfortunately I lost the link to the article I used to learn about this - fortunately I also used React Context docs while learning it.
I'll update this section as I think I understood this better

Using Higher Order Components from other frameworks/libraries

Styled Components

CSSinJS Theming

Material UI theming

Top comments (0)