https://zaklad.app/blog Design system tutorials and zaklad product updates. en-GB Sat, 01 Aug 2026 00:00:00 GMT https://zaklad.app/blog/whats-new-0-9-50 https://zaklad.app/blog/whats-new-0-9-50 Sat, 01 Aug 2026 00:00:00 GMT 0.9.50 gives every foundation type a guided builder, each with a Simple and Advanced mode, and hands your AI agent the very same tools over MCP, so you can build by hand or by instruction. It also brings new motion, gradient and shadow tokens, and a top to bottom refresh of the whole interface. update Luke Hawkins https://zaklad.app/blog/we-gave-our-design-system-a-brain https://zaklad.app/blog/we-gave-our-design-system-a-brain Mon, 22 Jun 2026 00:00:00 GMT We added MCP expecting a remote control. The emergent effect was stranger: pointed at our own system, it started auditing us, grading our palette and naming against sourced best practice, citations and all. The same connection also teaches the platform, ingests a scattered old system and writes real code. tutorial Luke Hawkins https://zaklad.app/blog/talk-to-your-design-system https://zaklad.app/blog/talk-to-your-design-system Fri, 19 Jun 2026 00:00:00 GMT Connect any AI to your zaklad project over MCP and change your live design system in plain language. One sentence, one reversible change, free on every plan. tutorial Luke Hawkins https://zaklad.app/blog/design-md-guide https://zaklad.app/blog/design-md-guide Thu, 18 Jun 2026 00:00:00 GMT A DESIGN.md file describes your entire design system in one document, so a generative design tool can build on the real thing instead of guessing. Here is what it is, why it matters, and how to use yours. tutorial Luke Hawkins https://zaklad.app/blog/bringing-an-existing-system-in https://zaklad.app/blog/bringing-an-existing-system-in Wed, 17 Jun 2026 00:00:00 GMT If you already have tokens, switching tools feels like a rebuild. It isn't. Your tokens are almost certainly already in DTCG JSON, the open standard most token tools export, and you can paste them straight in. Names and the way you've grouped them come across intact, so you start from your real system, not a blank canvas. tutorial Luke Hawkins https://zaklad.app/blog/whats-new-0-9-40 https://zaklad.app/blog/whats-new-0-9-40 Tue, 16 Jun 2026 00:00:00 GMT 0.9.40 opens your design system up to AI. Connect any AI agent over the new MCP server to read and change your system in plain language, and hand any AI tool the whole thing as a single DESIGN.md file. update Luke Hawkins https://zaklad.app/blog/computational-tokens https://zaklad.app/blog/computational-tokens Wed, 10 Jun 2026 00:00:00 GMT Most design tokens are flat values you edit by hand. Computational tokens are formulas that derive their value from other tokens, so a single change at the base re-flows everything downstream. Here is how they work, why we base ours on 16px, and how to build your own. tutorial Luke Hawkins https://zaklad.app/blog/colour-from-the-ground-up https://zaklad.app/blog/colour-from-the-ground-up Fri, 05 Jun 2026 00:00:00 GMT Most teams pick a handful of hex values by hand and hope they hold together. The long version: turning one brand colour into a full palette with OKLCH, light curves, smart hue correction, colour harmony, and a clear line between brand and status colour. tutorial Luke Hawkins https://zaklad.app/blog/type-that-scales https://zaklad.app/blog/type-that-scales Wed, 03 Jun 2026 00:00:00 GMT Good typography is not a font choice, it is a system: a scale of sizes that relate, styles that bundle every decision, and one set of names that holds across screen sizes, code and Figma. Here is how to build it from a single ratio. tutorial Luke Hawkins https://zaklad.app/blog/whats-new-0-9-3 https://zaklad.app/blog/whats-new-0-9-3 Tue, 02 Jun 2026 00:00:00 GMT 0.9.3 gives you two fast ways to begin. Point the wizard at your brand and it builds a full system you can fine-tune, or start from a production-ready base template. Plus more components and a round of fixes. update Luke Hawkins https://zaklad.app/blog/whats-new-0-9-2 https://zaklad.app/blog/whats-new-0-9-2 Wed, 27 May 2026 00:00:00 GMT 0.9.2 marks the official release of the zaklad Figma plugin. Install it straight from Figma, connect it to a project with one key, and sync your whole system, tokens, text styles, themes, modes, icons and components, into your file. update Luke Hawkins https://zaklad.app/blog/themes-and-modes https://zaklad.app/blog/themes-and-modes Mon, 25 May 2026 00:00:00 GMT Light, dark, high contrast, a brand variant. Most teams keep each theme as a separate copy that quietly drifts. zaklad models themes as one system whose variants inherit from each other, so each theme holds only what makes it different. Here is how semantic tokens carry the theme, how the inheritance works, how to switch and add themes, and what a theme becomes in Figma and in code. tutorial Luke Hawkins https://zaklad.app/blog/consuming-the-package https://zaklad.app/blog/consuming-the-package Sun, 24 May 2026 00:00:00 GMT A zaklad release ships as a generated npm package: one provider to wrap your app, components with a namespaced API your IDE completes for you, tokens you can read directly, compile-checked theme switching, and the same code running on web and React Native. Here is the whole developer onboarding, start to finish. tutorial Luke Hawkins https://zaklad.app/blog/versioned-releases-and-rollbacks https://zaklad.app/blog/versioned-releases-and-rollbacks Sat, 23 May 2026 00:00:00 GMT A live design system is a moving target, which is fine while you build and a problem the moment a team depends on it. A release freezes the whole system at a version, ships that exact state to code, Figma and a token export at once, and never moves again. Here is how immutable snapshots work, and why a rollback is just a version number. tutorial Luke Hawkins https://zaklad.app/blog/whats-new-0-9-1 https://zaklad.app/blog/whats-new-0-9-1 Fri, 22 May 2026 00:00:00 GMT 0.9.1 turns your design system into something you can version and ship. Cut a release, freeze the whole system at that version, and let Figma and code pull it on their own schedule. Plus a batch of new components and a round of UI polish. update Luke Hawkins https://zaklad.app/blog/responsive-without-breakpoints https://zaklad.app/blog/responsive-without-breakpoints Thu, 21 May 2026 00:00:00 GMT Most responsive work is a pile of breakpoints scattered through the code, redone for every component and again for every platform. zaklad replaces it with one fixed mechanism: a set of sizing tiers from XS to XL that every text style and component steps through together. Here is how it works, and why it covers the web and native at once. tutorial Luke Hawkins https://zaklad.app/blog/one-icon-system https://zaklad.app/blog/one-icon-system Wed, 20 May 2026 00:00:00 GMT Icons are where consistency quietly breaks: two libraries with different names, mismatched variants, and a design set that drifts from the coded one. Here is how to pull any number of icon libraries behind one consistent API, unify their variants, and keep code and Figma in step. tutorial Luke Hawkins https://zaklad.app/blog/three-token-layers https://zaklad.app/blog/three-token-layers Wed, 13 May 2026 00:00:00 GMT A design system is not a pile of values, it is three layers that build on each other. Here is how foundation, semantic and component tokens fit together, why a semantic token points at a value instead of holding one, and why that single decision is what lets a whole system change without breaking. tutorial Luke Hawkins