[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"categories-en-US":3,"blog-categories-en-US":3,"resource-flareum-en-US":4,"featured-sidebar-data-en-US":3,"latest-resources-en-US":57,"alternatives-flareum-en-US":124,"related-resources-flareum-en-US":155},true,{"id":5,"name":6,"slug":7,"url":8,"date_updated":9,"images_other":9,"tagline":10,"description":11,"seo":12,"features":15,"pros":24,"cons":30,"best_for":35,"cover":36,"icon":9,"pricing":37,"platform":38,"github_url":9,"twitter_url":9,"discord_url":9,"dribbble_url":9,"pricing_tiers":41,"views_count":43,"featured_rank":9,"categories":44,"tags":49,"files":9},832,"Flareum","flareum","https:\u002F\u002Fflareum.io\u002F",null,"Design system builder that syncs Figma and code","Flareum is a design system builder that helps design teams maintain a single source of truth for colors, typography, grids, and design tokens. It creates a synchronized workflow between Figma designs and production code, ensuring consistency across your entire product.\n\nThe platform features intelligent color palette generation with automated tint and shade creation, math-based typography scaling with support for Adobe Fonts and Google Fonts, grid systems tied to baseline, and seamless Figma plugin integration. A single change in Flareum propagates automatically to all connected Figma files and code repositories.\n\nWith Flareum, design teams can generate a complete guidebook, maintain CSS\u002FSCSS code output, and ensure that designers and developers are always working from the same design tokens.",{"title":13,"meta_description":14},"Flareum — Design system builder that syncs Figma and code","Flareum is a design system builder that helps design teams maintain a single source of truth for colors, typography, grids, and design tokens. It creates a s...",[16,17,18,19,20,21,22,23],"Centralized design system with colors, typography, and grids","Intelligent tint\u002Fshade generation for color palettes","Math-based typography scaling with ratio curves","Adobe Fonts and Google Fonts integration","Grid system tied to text baseline for vertical rhythm","Seamless Figma plugin for one-click sync","CSS\u002FSCSS code export for developers","Guidebook generation for team documentation",[25,26,27,28,29],"Single source of truth for design tokens","Fig designs and code stay in sync","Smart color palette generation","Typography scaling with mathematical precision","Figma plugin for easy integration",[31,32,33,34],"Figma ecosystem only","Learning curve for design token concepts","Limited to web\u002FUI design systems","Team features require paid plan","Best for design teams who want to maintain a synchronized design system between Figma and production code","7ce196b0-b5f3-49d4-ba83-cdff08424942.webp","freemium",[39,40],"Web","Figma",{"pro":3,"free":3,"note":42},"Free tier with basic features, paid for team collaboration",0,[45],{"name":46,"slug":47,"sub_categories":48},"Design Systems","design-systems",[],[50,51,54],{"name":46,"slug":47},{"name":52,"slug":53},"Figma File","figma-file",{"name":55,"slug":56},"Collaboration","collaboration",[58,89,100,110],{"id":59,"url":60,"icon":9,"name":61,"slug":62,"tags":63,"cover":85,"tagline":86,"is_featured":87,"date_created":88,"date_updated":9},858,"https:\u002F\u002Fwww.genspark.ai\u002F","Genspark Design","genspark-design",[64,67,69,71,73,75,77,79,81,83],{"seo":9,"name":65,"slug":66},"AI Powered","ai-powered",{"seo":9,"name":9,"slug":68},"ai",{"seo":9,"name":70,"slug":37},"Freemium",{"seo":9,"name":9,"slug":72},"free-trial",{"seo":9,"name":9,"slug":74},"image-editing",{"seo":9,"name":9,"slug":76},"video",{"seo":9,"name":9,"slug":78},"animation",{"seo":9,"name":9,"slug":80},"prototyping",{"seo":9,"name":9,"slug":82},"no-code",{"seo":9,"name":9,"slug":84},"productivity","fc3931e4-3210-4155-a94b-da3a261fe281.webp","The next-gen AI for design — powered by Claude Opus 4.7",false,"2026-06-28T03:12:01.911314+00:00",{"id":90,"url":91,"icon":9,"name":92,"slug":93,"tags":94,"cover":97,"tagline":98,"is_featured":87,"date_created":99,"date_updated":9},857,"https:\u002F\u002Folivia-tsui.github.io\u002Fct\u002F","World's Best Scale Tool","worlds-best-scale-tool",[95],{"seo":9,"name":9,"slug":96},"colors","eb5afb81-91ac-496d-96b6-bd870afbc2a8.webp","Advanced color scale and palette generation tool","2026-06-24T04:31:04.697212+00:00",{"id":101,"url":102,"icon":9,"name":103,"slug":104,"tags":105,"cover":107,"tagline":108,"is_featured":87,"date_created":109,"date_updated":9},856,"https:\u002F\u002Fwww.tints.dev\u002F","Tailwind CSS Color Generator","tailwind-css-color-generator",[106],{"seo":9,"name":9,"slug":96},"bd6eba7c-091e-4cfa-83c6-a7f3392e1032.webp","Tailwind CSS 11-color palette generator and API","2026-06-24T04:30:57.92162+00:00",{"id":111,"url":112,"icon":9,"name":113,"slug":114,"tags":115,"cover":121,"tagline":122,"is_featured":87,"date_created":123,"date_updated":9},855,"https:\u002F\u002Fscreensiz.es\u002F","Screensiz.es","screensiz-es",[116,119],{"seo":9,"name":117,"slug":118},"Free","free",{"seo":9,"name":9,"slug":120},"inspiration","b56672d4-1eab-4481-a3f5-4440977fb881.webp","Device screen sizes and viewport reference","2026-06-24T04:30:50.994519+00:00",[125,131,137,143,149],{"url":126,"name":127,"slug":128,"cover":129,"tagline":130},"https:\u002F\u002Fspecifyapp.com","Specify","specify","ac2bb029-95df-4617-97ca-6051f5dccfc1.webp","Design token platform that pushes your design decisions to code — automatically",{"url":132,"name":133,"slug":134,"cover":135,"tagline":136},"https:\u002F\u002Fzeroheight.com","Zeroheight","zeroheight","8f4828c0-3236-44df-9cce-4b74ad2700f7.webp","Living design system documentation — connect Figma to code with interactive docs",{"url":138,"name":139,"slug":140,"cover":141,"tagline":142},"https:\u002F\u002Fvibe.monday.com\u002F","Vibe Design System","vibe-design-system","dd832223-6926-4f37-8bd9-2bf392483972.webp","monday.com's open-source design system for consistent, accessible work management interfaces.",{"url":144,"name":145,"slug":146,"cover":147,"tagline":148},"https:\u002F\u002Fwww.figma.com\u002F@holaluzdesign","Watt Design System","watt-design-system","eb4ad657-8eef-4e17-a931-acd12dcec1cd.webp","Holaluz's Figma-based UI kit for consistent, accessible renewable energy interfaces.",{"url":150,"name":151,"slug":152,"cover":153,"tagline":154},"https:\u002F\u002Fa2ui.org\u002F","A2UI","a2-ui","573cf97b-b61e-4e5b-b494-c0a0a00c861e.webp","open-source protocol for AI agents to generate secure, declarative UIs across platforms.",[156,165,172],{"url":132,"icon":9,"name":133,"slug":134,"tags":157,"cover":135,"tagline":136,"is_featured":9,"date_created":164,"date_updated":9},[158,159,160,161,163],{"seo":9,"name":9,"slug":47},{"seo":9,"name":9,"slug":56},{"seo":9,"name":9,"slug":80},{"seo":9,"name":9,"slug":162},"design-handoff",{"seo":9,"name":9,"slug":53},"2026-06-16T07:16:42.647437+00:00",{"url":126,"icon":9,"name":127,"slug":128,"tags":166,"cover":129,"tagline":130,"is_featured":9,"date_created":171,"date_updated":9},[167,168,170],{"seo":9,"name":9,"slug":56},{"seo":9,"name":9,"slug":169},"version-control",{"seo":9,"name":9,"slug":162},"2026-06-16T07:14:19.135613+00:00",{"url":173,"icon":174,"name":175,"slug":176,"tags":177,"cover":179,"tagline":180,"is_featured":9,"date_created":181,"date_updated":182},"https:\u002F\u002Fvuetifyjs.com\u002F","bd46950f-9a47-4d81-95da-ed6467288051.svg","Vuetify","vuetify",[178],{"seo":9,"name":9,"slug":47},"screenshots\u002Fvuetify.webp","Vuetify is a complete Vue.js UI framework that strictly adheres to Material Design guidelines, offering a rich set of components and powerful customization capabilities.","2025-10-15T08:20:56.561+00:00","2026-06-12T06:51:44.386368+00:00"]