Starbucks has published the styleguide for their website, which gives some interesting insights on the elements, grid, code and styles they use.

Especially when you are working on a bigger project in a team, such a styleguide is a great way to make sure that everybody is using the same design and code elements and to keep stuff consistent. It also makes the life of designers and developers way easier by being able to reuse elements from a shared library rather than reinventing the wheel.

Such styleguides are also a common tool in corporate design and branding projects and have been used in the "print world" for ages. They normally include stuff like the corporate logo, fonts, font sizes, colors, grids, common design templates and such. For web projects they are extended to include also global css styles, javascript components, reusable HTML structures, etc.

The Kirby Styleguide Theme

A web-based styleguide is a great Kirby use case and so I've decided to build a tiny little theme for Kirby, which you can use as a starting point for your next project's styleguide:

Feel free to download the theme over at Github: and to modify it for your own project.

The theme is free but a Kirby license is needed as soon as you use the styleguide in production.

Our partners

CDN by KeyCDN Search by Algolia