[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fsteel\u002Fcomponents":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":51,"showcases":194,"links":195,"dates":214},"\u002Fexamples\u002Fapps\u002Fsteel\u002Fcomponents","detail","components",true,{"title":9,"description":10,"og_image":11},"Steel UI components examples - Nicelydone","Browse Steel UI component design examples. Preview individual interface elements and explore related component categories. Browser infrastructure for AI agents","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ffbb87f2f-4759-4007-9313-72ccae129bbe.png",[13,16,19,22],{"label":14,"to":15},"Examples","\u002Fexamples",{"label":17,"to":18},"SaaS app design examples","\u002Fexamples\u002Fapps",{"label":20,"to":21},"Steel design examples","\u002Fexamples\u002Fapps\u002Fsteel",{"label":23,"to":4},"Steel UI components examples",{"title":23,"eyebrow":25,"description":10,"sections":26,"body":27},"SaaS app examples",[],[],{"title":29,"slug":30,"description":31,"logo":32,"url":33,"categories":34},"Steel","steel","Browser infrastructure for AI agents","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F03f0fa43-a227-4dce-b66a-f340f4551973.png","https:\u002F\u002Fsteel.dev\u002F",[35,39,43,47],{"id":36,"title":37,"slug":38},48,"Developer Tools","developer-tools",{"id":40,"title":41,"slug":42},80,"Artificial Intelligence","artificial-intelligence",{"id":44,"title":45,"slug":46},37,"Developer APIs","developer-apis",{"id":48,"title":49,"slug":50},45,"Open Source","open-source",[52,67,80,93,106,119,132,145,158,171,178,186],{"uuid":53,"title":54,"description":55,"canonical_path":4,"image":11,"width":56,"height":57,"image_alt":58,"kind":59,"categories":60,"app":65},"a30ccd7f-49c6-4f39-93b3-d20c5e0a6392","Steel UI component","A section detailing a quick build setup process, featuring a command-line interface (CLI) code snippet for installation.",2413,865,"UI component from Steel","component",[61],{"id":62,"title":63,"slug":64},187,"Code block","code-block",{"slug":30,"title":29,"logo":32,"categories":66},[],{"uuid":68,"title":54,"description":69,"canonical_path":4,"image":70,"width":71,"height":72,"image_alt":58,"kind":59,"categories":73,"app":78},"48f82f44-22e3-4643-ae3a-d9f180c5ca19","A setup guide for browser use with code examples and step-by-step instructions.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F44b2f75e-edd2-47f0-bebd-1697b1f987f2.png",1936,1745,[74],{"id":75,"title":76,"slug":77},227,"Stepper","stepper",{"slug":30,"title":29,"logo":32,"categories":79},[],{"uuid":81,"title":54,"description":82,"canonical_path":4,"image":83,"width":84,"height":85,"image_alt":58,"kind":59,"categories":86,"app":91},"8c07d754-4996-40dc-bbf9-21dc1059aee7","A dark-themed web application header with global navigation, team selection, and user profile access.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F742e6ec3-8952-411f-8cde-45e8bd728f18.png",3280,435,[87],{"id":88,"title":89,"slug":90},240,"Horizontal navigation","horizontal-navigation",{"slug":30,"title":29,"logo":32,"categories":92},[],{"uuid":94,"title":54,"description":95,"canonical_path":4,"image":96,"width":97,"height":98,"image_alt":58,"kind":59,"categories":99,"app":104},"ed29ec6d-a850-4dc7-bf15-d466f021a082","A dashboard displaying monthly usage statistics and billing information.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fb1edef9b-6d36-409b-b6ae-ce1e6918bc75.png",2627,658,[100],{"id":101,"title":102,"slug":103},213,"Progress indicator","progress-indicator",{"slug":30,"title":29,"logo":32,"categories":105},[],{"uuid":107,"title":54,"description":108,"canonical_path":4,"image":109,"width":110,"height":111,"image_alt":58,"kind":59,"categories":112,"app":117},"0c745039-ca92-4a77-ac31-e1676b9ad223","A user interface displaying a chronological log of agent traces, including navigation events to different URLs and scroll actions, organized under a tabbed navigation system.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F2a4f0b9c-1b48-4f85-9687-56fc3408aa09.png",1125,1605,[113],{"id":114,"title":115,"slug":116},249,"Timeline & history","timeline-history",{"slug":30,"title":29,"logo":32,"categories":118},[],{"uuid":120,"title":54,"description":121,"canonical_path":4,"image":122,"width":123,"height":124,"image_alt":58,"kind":59,"categories":125,"app":130},"532bc2d1-bfbf-4e89-af1c-69862bd9a6a0","A user interface displaying a list of invited members with their roles and actions, featuring tab navigation.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ff2624270-30b7-43b5-9a9b-524a10fd4a47.png",2560,781,[126],{"id":127,"title":128,"slug":129},248,"Table","table-2",{"slug":30,"title":29,"logo":32,"categories":131},[],{"uuid":133,"title":54,"description":134,"canonical_path":4,"image":135,"width":136,"height":137,"image_alt":58,"kind":59,"categories":138,"app":143},"f99a1f5b-1a50-4c7e-8a94-b70fb09a4de2","A tabbed navigation component with three tabs and a flag icon on the right side.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F0b2ae807-def9-4490-9814-68c1d589d131.png",1093,256,[139],{"id":140,"title":141,"slug":142},233,"Tabs","tabs",{"slug":30,"title":29,"logo":32,"categories":144},[],{"uuid":146,"title":54,"description":147,"canonical_path":4,"image":148,"width":149,"height":150,"image_alt":58,"kind":59,"categories":151,"app":156},"b57804fe-2ccb-4ced-8c30-fcb06758f3cd","A modal dialog for inviting new members and assigning their roles within an application.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F077ffec0-b867-4965-a003-63050c034fdd.png",1001,678,[152],{"id":153,"title":154,"slug":155},252,"Input tag","input-tag",{"slug":30,"title":29,"logo":32,"categories":157},[],{"uuid":159,"title":54,"description":160,"canonical_path":4,"image":161,"width":162,"height":163,"image_alt":58,"kind":59,"categories":164,"app":169},"30a45a0c-0bd1-4289-91ba-c1462d85dc0c","Dropdown menu for team or organization selection and management within a dark mode application interface.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fe5a49982-5e12-4b54-911a-cb101eef8664.png",818,458,[165],{"id":166,"title":167,"slug":168},190,"Dropdown menu","dropdown-menu",{"slug":30,"title":29,"logo":32,"categories":170},[],{"uuid":172,"title":54,"description":95,"canonical_path":4,"image":173,"width":97,"height":98,"image_alt":58,"kind":59,"categories":174,"app":176},"9b9313c8-a369-4f30-83e8-ee2e1b6b62f8","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F3f78559c-0a87-4467-8501-40779e3c8336.png",[175],{"id":101,"title":102,"slug":103},{"slug":30,"title":29,"logo":32,"categories":177},[],{"uuid":179,"title":54,"description":180,"canonical_path":4,"image":181,"width":123,"height":124,"image_alt":58,"kind":59,"categories":182,"app":184},"4f158cca-2492-4744-a408-7b886c31bd7e","A user management interface displaying members and invitations in a table format with tabbed navigation.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fc389a759-3759-4d2c-b6b4-e901f33d55eb.png",[183],{"id":127,"title":128,"slug":129},{"slug":30,"title":29,"logo":32,"categories":185},[],{"uuid":187,"title":54,"description":188,"canonical_path":4,"image":189,"width":110,"height":111,"image_alt":58,"kind":59,"categories":190,"app":192},"ae328593-ab58-4582-a240-2978415c1a2d","A user interface displaying agent traces with navigation and scroll events in a timeline format.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fdc6913fe-2ed8-4465-bb6f-dbaebb3ff509.png",[191],{"id":114,"title":115,"slug":116},{"slug":30,"title":29,"logo":32,"categories":193},[],[],[196,199,202,205,208,211],{"label":197,"to":198},"Steel product screens","\u002Fexamples\u002Fapps\u002Fsteel\u002Fscreens",{"label":200,"to":201},"Steel marketing pages","\u002Fexamples\u002Fapps\u002Fsteel\u002Fmarketing",{"label":203,"to":204},"Steel user flows","\u002Fexamples\u002Fapps\u002Fsteel\u002Fflows",{"label":206,"to":207},"Developer Tools app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fdeveloper-tools",{"label":209,"to":210},"Artificial Intelligence app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fartificial-intelligence",{"label":212,"to":213},"Developer APIs app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fdeveloper-apis",{"published_at":215,"updated_at":216},"2026-05-30T11:02:26.000Z","2026-09-13T13:02:39.000Z"]