This week we open sourced two gorgeous Studio styles: Emerald and Winter Wonderland. I decided to grab one of these styles and make it my own.
I opened up Emerald’s repository, forked it to my Github account, and cloned it to my local machine. Next, I opened up the style in Studio.
I wanted to play off the style’s name Emerald and make the design literal. Think shades of green and a little bit of bling. To start, I changed the font family for all the labels to HolmenOT. I opened up the Labels style sheet and updated the font variables with the new font family.
To really capture the emerald vibe I decided to change up the rail station icons. I found the SVG Emerald-City by Christine Komatsu from the Noun Project. I saved the emerald SVG to my project’s icon folder and then swapped out the rail station icon path for the emerald.
Since the emerald is an SVG, I can style it with CartoCSS. I lightened it up with marker-fill: #333. I also updated the attribution in the Settings panel to credit the icon’s artist.