Christopher Deane

Scale 4.0 is out 🚀 Scale is now an open source design system built on @buildWithLit Components. Foundations, 60+ components and context for human and AI driven engineering. Lit joins its premium @figma and @framer cousins. scaledesignsystem.com #scaledesignsystem #lit

Now, I love #claude, but if you're on a @claudeai pro plan, you'll reach your #claudedesign weekly limit in 15 minutes, creating 28 of an 118 component #designsystem in #react instead of #lit. See you in a week Claude Design 😐 @react @buildWithLit #scaledesignsystem

And that's a wrap! The final 3 episodes of my @figma FDS #designsystem series are up where we create #input, #row and #alert components 🤘 Check out the last episode here: youtu.be/MfsadNfmdU8 @YouTube #figma #tutorial

Scale for #framer is here 👋 - 56 Components. 8,368 possibilities - 120 Styles & Variables - 288 Feather and Status Icons - 15 Content Modules. 8,117 possibilities - 3 Page Templates Design in @figma , build in @framer, or do both at: scaledesignsystem.com #scaledesignsystem

In the second episode of my #pencildev series, we export Semantic Color Variables from @figma and use @claudeai to convert them into Pencil variables automatically 🤘. youtu.be/G7kQucKyTcQ?si=j_8t… #vibedesign #ai #claudecode #vscode

In my latest tutorial we look at #Pencil from @tomkrcha and High Agency, a bi-directional MCP design canvas for @AnthropicAI @claudeai Code, and see whether this is the AI Design tool we’ve been dreaming of. youtu.be/DSow83bnO4g?si=B-7C… #vibedesign #ai #claudecode #vscode

Episode 17 of my tutorial series is up where we create a #designsystem in @figma called FDS. In this episode, we’re doing the Help Text Component 🤘. youtu.be/4iuVkgYkCm4 @YouTube #figma #tutorial #helptext

First time (that I know of) that someone has ripped off my work and is claiming it as their own. @Suryanaray98176 released MDS on the Figma community that is a copy of my FDS tutorial series system: youtu.be/3a0GF5cE3G0?si=teRI… Here's a comparison: FDS left, MDS right. @figma

Scale for @framer progress update: Foundations, Components, Sections and a few Templates are done. Now working on Cover frames, then docs and a new site. We're almost there 🙂. Check out the @figma version of Scale here: scaledesignsystem.com/ #scaledesignsystem #framer #figma

Scale for @framer progress update: Hero, Feature, FAQ, CTA and Logo Section module components. And Table, Toast and Tooltip components. #scaledesignsystem #framer

Scale for @framer progress update: Help Text, Menu, Modal, Tabs, Toggle components. #scaledesignsystem #framer

Scale for @framer progress update: Badge, Banner, Button Pill, Button Icon, Breadcrumbs, Form, Status Indicator components. #scaledesignsystem #framer

Scale for @framer progress update: Accordion, Alert, Avatar, Button and Spinner components. #scaledesignsystem #framer

Liquid Glass Materials and Components are here with Scale 3.0! Grab a licence at scaledesignsystem.com, members grab it from your @gumroad library🤘. #scaledesignsystem @figma @Apple #liquidglass #iOS26

Episode 16 of my tutorial series is up where we create a #designsystem in @figma called FDS. In this episode, we’re doing Checkbox and Radio Components 🤘 youtu.be/e3TKQpPSwFk @YouTube #figma #tutorial

In my latest tutorial, learn how to use @figma's MCP to convert a Button component into a @reactjs one using @Microsoft visual studio @code, @roocode and @Google @GeminiApp 2.5 Pro. youtu.be/YSEH_Dk0dpI #scaledesignsystem #figma #AI #mcp #vscode #roocode #storybook

Episode 15 of my tutorial series is up where we create a #designsystem in @figma called FDS. In this episode, we’re doing some updates🤘 youtu.be/vAUyC5nFNLs?si=lCch… @YouTube #figma #tutorial

Scale v2.9.5 has been released! Grab a licence at scaledesignsystem.com, members grab it from your @gumroad library. This release include Scales first plugin: Semantic Color Variable Picker! 🤘 #scaledesignsystem @figma

Used #ai to created my first @figma plugin that allows you to find the right semantic variable when you design with #scaledesignsystem 🤘 Vibe coded in @code, #roocode with @Google #gemini 2.5 then reviewed by @github #Copilot Agent Mode and @AnthropicAI #claude 3.2 🤩

Scale for @reactjs progress. 11 components including an Avatar that can display an icon, image, text or group along with it's status. @figma to @code with #talktofigmamcp and @roocode using @GeminiApp 2.5 ✨. #scaledesignsystem @sonnylazuardi #roocode #googlegemini #avatar #ai