Sketch Symbol Library for Prototyping Semantic UI


I’m loving Semantic UI and how easy it is to get projects started with the expansive component library. I noticed you guys had a Sketch file listed in the docs that has a good amount of components, but none of them actually converted to symbols, making the customization of it very cumbersome.

I created a Sketch symbol library and style guide for Semantic UI. It’s got the same colors, same font (Lato), same everything as much as I could copy (down to the border radius and padding).

I’ve recreated a good chunk of the components into recyclable symbols, from buttons to inputs to base components like segments. If you want to change the color or styling of anything, it’s reflected across all the symbols/components. It’s based off a great styleguide by Jan Losert. You can export a style guide anytime with all your colors, text styles, and components.

I uploaded the Sketch file to Github here if you’d like to download it. Please also feel free to fork it and contribute some of the missing components. There’s still plenty of work to be done, but I feel like it’s a much stronger foundation than the previous Sketch template.

If you have any questions or feedback, feel free to hit me up here, on Github, or Twitter.

Thank you for your time and shoutout to all the homies contributing to this great system.



nice work Oscar!
more characters