Since I discovered the Dracula theme, it's been my go-to color scheme for any app or new project. I use it everywhere: my terminal (Alacritty), my editor (VS Code), my other editor (Micro), my chat (Slack), my browser (Chrome), my notes (Obsidian), etc.
I also use it as the color scheme whenever I begin a new project. It gives the project a great look from the start and is one less decision I must make. The Dracula website and their GitHub repo are both awesome and include a ton of helpful information, but they don't have any simple references for the theme's colors. I always have to dig up the color codes whenever I want to plug them into a simple starter web page.
Hence this blog post and https://dracula-colors.stormhold.net. I created this webpage to serve as an easy-to-use visual and code reference for the Dracula theme. The webpage includes the main colors of the Dracula theme and the extended colors that have variations, such as lighter and darker shades and accent colors. You can view the code for the page on my GitHub.
I designed the page to be easy to use and navigate. Each color is presented in a thumbnail format, with the name and RGB value displayed below. Clicking on a thumbnail will copy the RGB value to your clipboard, making it easy to paste into your own code.
The webpage also provides CSS variables for each color so you can easily integrate them into your own stylesheets. The CSS variables are presented in code blocks; clicking on the blocks will copy the entire code snippet to your clipboard.
I hope this webpage is a valuable resource for anyone looking to use the Dracula theme in their web projects. And don't forget to check out the origins of the theme - it's a great story.
Thanks for reading!