[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"categories-en-US":3,"blog-categories-en-US":3,"resource-vaadin-design-system-en-US":4,"featured-sidebar-data":3,"latest-resources-en-US":27},true,{"id":5,"name":6,"slug":7,"url":8,"date_updated":9,"images_other":9,"tagline":10,"description":11,"seo":9,"cover":12,"icon":13,"categories":14,"tags":19,"files":20,"pricing":24,"platform":25},473,"Vaadin Design System","vaadin-design-system","https:\u002F\u002Fvaadin.com\u002Fdesign-system",null,"open-source framework for consistent, accessible enterprise web apps with web components.","Vaadin Design System is Vaadin's official open-source design system for building modern, consistent, and accessible enterprise web applications using web components (Hilla\u002FLit-based). It provides reusable UI components, patterns, guidelines, and tools focused on business applications like dashboards, forms, and data grids, emphasizing performance, theming, and developer productivity. It integrates seamlessly with Vaadin Flow (Java) and Hilla (TypeScript\u002FReact) frameworks for full-stack development.\n\n#### Key Features\n- **Component Library**: Reusable web components like buttons, grids, charts, forms, date pickers, and layouts with variants for themes (light\u002Fdark\u002FLumo).\n- **Design Tokens**: Semantic colors, typography, spacing, shadows, and motion for easy theming.\n- **Accessibility**: WCAG 2.1 AA compliance with ARIA support and keyboard navigation.\n- **Tools**: Figma kit for prototyping; Vaadin components for implementation; Theme Editor for customization.","1896dffa-4fa6-4de0-b0a3-a4418d7e1865.webp","aa31135c-a842-44fb-84ee-4599383bb016.svg",[15],{"name":16,"slug":17,"sub_categories":18},"Design Systems","design-systems",[],[],[21],{"url":22,"type":23},"https:\u002F\u002Fwww.figma.com\u002Fcommunity\u002Ffile\u002F843042473942860131\u002Fvaadin-design-system","figma","free",[26],"Browser",[28,38,48,59],{"id":29,"url":30,"icon":31,"name":32,"slug":33,"tags":34,"cover":35,"tagline":36,"is_featured":9,"date_created":37,"date_updated":9},612,"https:\u002F\u002Fusekodo.ai\u002F","b8589471-7a55-4558-a0b6-cac7a1805df0.svg","Kodo","kodo",[],"d422b1d4-6094-488c-88e1-c1ea3d2414fd.webp","An AI design tool that transforms text prompts into stunning, fully editable professional layouts.","2026-03-26T08:58:15.249+00:00",{"id":39,"url":40,"icon":41,"name":42,"slug":43,"tags":44,"cover":45,"tagline":46,"is_featured":9,"date_created":47,"date_updated":9},611,"https:\u002F\u002Fveeso.ai\u002F","477fe179-812f-45ff-8acb-eb1cb5fe8ac7.svg","Veeso AI","veeso-ai",[],"5bdc2f95-a5a7-4e52-b859-e2cafcf0ec85.webp","An AI tool that instantly transforms raw text content into professional, production-ready designs.","2026-03-26T08:48:55.54+00:00",{"id":49,"url":50,"icon":51,"name":52,"slug":53,"tags":54,"cover":55,"tagline":56,"is_featured":9,"date_created":57,"date_updated":58},603,"https:\u002F\u002Fopenclaw.ai\u002F","4863562c-0b51-4de2-98d1-1bd54e66cb14.svg","OpenClaw","open-claw",[],"aee1eea9-9f8f-4542-9cfa-509a3fd4c937.webp","An open-source personal AI assistant that runs locally and performs tasks via your favorite chat apps.","2026-01-25T07:01:21.29+00:00","2026-03-20T02:34:02.428+00:00",{"id":60,"url":61,"icon":62,"name":63,"slug":64,"tags":65,"cover":66,"tagline":67,"is_featured":9,"date_created":68,"date_updated":9},610,"https:\u002F\u002Fhandwrittengenerator.com\u002F","23222ea6-35f4-4186-b959-43113e84192a.svg","Handwritten Generator","handwritten-generator",[],"b9d9379f-fd78-4db4-8247-915a4b5e2bf3.webp","An online tool that instantly converts digital text into realistic handwritten images.","2026-03-20T02:27:03.068+00:00"]