Today we're super excited to announce the launch of one of our most requested features to date.
For almost as long as Replit has been around, people in the community have been asking for a way to create and share their very own Custom Themes! Well now you can.
With Custom Themes, you can truly make Replit yours by styling everything from the app's colors, both in the IDE and across the site, to the syntax highlighting in your code.
Create
To get started, simply visit the themes section under your account page and hit "Create Theme". From there, give your new theme a title, add a description, and select a color scheme (light or dark).
Once your theme is created, you'll be dropped into the Themes Editor. In the Themes Editor, you can change the global tokens, which include the background, foreground, primary, and outline colors that you'll see throughout the entire site.
Just below that is the syntax higlighting editor where you can configure how various tokens appear in your code. These will apply in the IDE as well as everywhere else you might see a code editor. With custom syntax highlighting, you can change the look and feel of everything from variable names and language-specific keywords to literals like strings and numbers!
You'll also be able to preview the changes you make to the theme live right in the editor to get a feel for how it'll look the next time you're coding! The preview editor contains some example code and features many of our most popular languages including JavaScript, Python, and Java.
Updates to the theme will be auto-saved for you as you tweak its values so you'll never have to worry about losing any of the changes you've made.
Watch the entire flow in action here:
Once you're done creating your theme, you can publish it to the Community! Don't worry if your theme isn't perfect yet - you can always publish updates if you decide to make any changes in the future.
To learn more about how to create and publish your very own Custom Theme, take a look at our docs!
Explore
If making themes isn't your thing, you can also browse and install existing themes from the Community on the Explore Page.
From the Themes Explore Page, you can see the most popular themes that others in the community have created and published.
If you're looking for something specific, you can also filter themes by title, author, color scheme (light or dark), and even specific hex codes like so:
Once you've found a theme you really like, you can click on its card to navigate to its Cover Page. On the Cover Page, you can preview, share, and install a theme! If you're really happy with what they've made, you can even leave the creator a tip in Cycles!
Any themes that you've created and installed will appear under your account page, alongside the existing official themes, so that you can easily switch between them at any time!
If you need some inspiration to help you get started, take a look at some of the popular existing themes that people in our community have recreated such as Dracula, Nord, Gruvbox, Atom One Dark, Tanne, Solarized, and more.
We hope that you enjoy using Custom Themes on Replit and are super excited to see what you create. Happy theming!
