[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Farcade\u002Fcomponents":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":29,"examples":57,"showcases":233,"links":234,"dates":253},"\u002Fexamples\u002Fapps\u002Farcade\u002Fcomponents","detail","components",true,{"title":9,"description":10,"og_image":11},"Arcade UI components examples - Nicelydone","Browse Arcade UI component design examples. Preview individual interface elements and explore related component categories. Create effortlessly beautiful…","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F851de8cc-abd5-4577-bda7-8f0c2f4b9392.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},"Arcade design examples","\u002Fexamples\u002Fapps\u002Farcade",{"label":23,"to":4},"Arcade UI components examples",{"title":23,"eyebrow":25,"description":26,"sections":27,"body":28},"SaaS app examples","Browse Arcade UI component design examples. Preview individual interface elements and explore related component categories. Create effortlessly beautiful demos in minutes",[],[],{"title":30,"slug":31,"description":32,"logo":33,"url":34,"twitter_username":35,"categories":36},"Arcade","arcade","Create effortlessly beautiful demos in minutes","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Farcade-661b86c8.png","https:\u002F\u002Fwww.arcade.software","arcade_demo",[37,41,45,49,53],{"id":38,"title":39,"slug":40},8,"Design","design",{"id":42,"title":43,"slug":44},25,"Marketing","marketing",{"id":46,"title":47,"slug":48},80,"Artificial Intelligence","artificial-intelligence",{"id":50,"title":51,"slug":52},100,"Video","video",{"id":54,"title":55,"slug":56},103,"Demo Automation","demo-automation",[58,73,88,103,118,130,145,160,175,189,204,218],{"uuid":59,"title":60,"description":61,"canonical_path":4,"image":11,"width":62,"height":63,"image_alt":64,"kind":65,"categories":66,"app":71},"ff74ecab-a43e-4988-bc1b-c8708d164685","Flow Builder Canvas","A visual flow builder canvas showing three connected steps. The steps are represented by thumbnail cards with connection lines and 'add' buttons between them. The central card is selected, indicated by a blue border.",2489,639,"Flow Builder Canvas from Arcade","component",[67],{"id":68,"title":69,"slug":70},174,"Card","card",{"slug":31,"title":30,"logo":33,"categories":72},[],{"uuid":74,"title":75,"description":76,"canonical_path":4,"image":77,"width":78,"height":79,"image_alt":80,"kind":65,"categories":81,"app":86},"0feefefd-42d8-4089-bf64-7732d1d6a589","Feature Tooltip","A dark-themed tooltip explaining a form feature, triggered by hovering over an icon in a vertical toolbar.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Faeaf82c6-555f-465b-bcbd-0583f16dbf80.png",643,860,"Feature Tooltip from Arcade",[82],{"id":83,"title":84,"slug":85},254,"Tooltip","tooltip-element",{"slug":31,"title":30,"logo":33,"categories":87},[],{"uuid":89,"title":90,"description":91,"canonical_path":4,"image":92,"width":93,"height":94,"image_alt":95,"kind":65,"categories":96,"app":101},"aa366330-cbb0-4cb9-b299-a16877b30c79","Informational alert","A small, rounded alert banner providing a helpful tip about pasting steps.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fb1da0751-1dcb-48eb-a32c-466b8de8d0b4.png",721,192,"Informational alert from Arcade",[97],{"id":98,"title":99,"slug":100},167,"Alert","alert",{"slug":31,"title":30,"logo":33,"categories":102},[],{"uuid":104,"title":105,"description":106,"canonical_path":4,"image":107,"width":108,"height":109,"image_alt":110,"kind":65,"categories":111,"app":116},"601771d8-b47a-4ecb-aad8-8cf7000d9228","Floating toolbar","A vertical floating toolbar containing three distinct groups of icon buttons. The top group has a single palette icon. The middle group has two connection\u002Fsharing icons, with the top one selected. The bottom group has three icons for layout\u002Flayers, with the bottom one showing a blue notification dot.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fceeda62b-5825-45da-8873-07e03a8dfde5.png",242,692,"Floating toolbar from Arcade",[112],{"id":113,"title":114,"slug":115},183,"Color picker","color-picker",{"slug":31,"title":30,"logo":33,"categories":117},[],{"uuid":119,"title":120,"description":121,"canonical_path":4,"image":122,"width":123,"height":124,"image_alt":125,"kind":65,"categories":126,"app":128},"93e356ad-7366-49cf-a029-cb6818683b8a","List item with thumbnail","A horizontal list item displaying a video collection with a checkbox, thumbnail, title, publish status dropdown, and an overflow menu.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fa4ab807f-d605-421f-b8ef-de4c04fa8e0d.png",2336,444,"List item with thumbnail from Arcade",[127],{"id":68,"title":69,"slug":70},{"slug":31,"title":30,"logo":33,"categories":129},[],{"uuid":131,"title":132,"description":133,"canonical_path":4,"image":134,"width":135,"height":136,"image_alt":137,"kind":65,"categories":138,"app":143},"177d19fb-b2a0-4ce1-8843-6b44dc189fd3","Workspace Breadcrumb","A breadcrumb navigation component showing the current location within a workspace hierarchy. It features a folder icon button followed by the workspace name, a separator, and the current collection name.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F5f6e4a56-aab7-4f01-9b58-25e4c1753963.png",1123,320,"Workspace Breadcrumb from Arcade",[139],{"id":140,"title":141,"slug":142},177,"Breadcrumb","breadcrumb",{"slug":31,"title":30,"logo":33,"categories":144},[],{"uuid":146,"title":147,"description":148,"canonical_path":4,"image":149,"width":150,"height":151,"image_alt":152,"kind":65,"categories":153,"app":158},"83c33d16-3498-4af2-be40-ee6e52e41992","Text alignment toolbar","A floating toolbar with text alignment options positioned above a selected text input field.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F882f47f2-3bf9-4d7f-b6ff-54c9718d0f57.png",1207,552,"Text alignment toolbar from Arcade",[154],{"id":155,"title":156,"slug":157},201,"Input text","input-text",{"slug":31,"title":30,"logo":33,"categories":159},[],{"uuid":161,"title":162,"description":163,"canonical_path":4,"image":164,"width":165,"height":166,"image_alt":167,"kind":65,"categories":168,"app":173},"b2322c76-d329-4827-bc6a-614fe4439cef","Share popover","A popover menu triggered by a Share button, containing a toggle to enable link sharing and a read-only input field with a copy button.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F18b12ba3-c109-41e1-989b-24962edd5b3e.png",925,420,"Share popover from Arcade",[169],{"id":170,"title":171,"slug":172},190,"Dropdown menu","dropdown-menu",{"slug":31,"title":30,"logo":33,"categories":174},[],{"uuid":176,"title":177,"description":178,"canonical_path":4,"image":179,"width":180,"height":181,"image_alt":182,"kind":65,"categories":183,"app":187},"0aa574ff-9582-439c-a6dc-1d280c35ba31","Segmented control","A segmented control with three options: All, Arcades, and Collections. The 'All' option is currently selected, indicated by a white background and border, while the unselected options have a transparent background.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fca14a359-5f86-4de2-96f8-ebc0c1467d51.png",555,234,"Segmented control from Arcade",[184],{"id":185,"title":177,"slug":186},218,"segmented-control",{"slug":31,"title":30,"logo":33,"categories":188},[],{"uuid":190,"title":191,"description":192,"canonical_path":4,"image":193,"width":194,"height":195,"image_alt":196,"kind":65,"categories":197,"app":202},"f66074d1-533e-466b-a13a-6b73c2ad00d6","Trial status card","A card displaying the remaining days of a trial, a progress bar, and an upgrade button.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F92f21b34-d68b-4862-8bfd-29c3a9104eb2.png",576,476,"Trial status card from Arcade",[198],{"id":199,"title":200,"slug":201},213,"Progress indicator","progress-indicator",{"slug":31,"title":30,"logo":33,"categories":203},[],{"uuid":205,"title":206,"description":207,"canonical_path":4,"image":208,"width":123,"height":209,"image_alt":210,"kind":65,"categories":211,"app":216},"19d015cb-1034-4432-a326-ff82e0f19820","KPI Grid","A grid of KPI cards displaying various metrics such as Views, Plays, Completions, CTA Clicks, and Play Time, alongside a prominent title card and a toggle for email digests.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F8f901c02-59ea-41c7-a172-1b80c7b9e5fa.png",945,"KPI Grid from Arcade",[212],{"id":213,"title":214,"slug":215},186,"Charts","charts",{"slug":31,"title":30,"logo":33,"categories":217},[],{"uuid":219,"title":220,"description":221,"canonical_path":4,"image":222,"width":223,"height":224,"image_alt":225,"kind":65,"categories":226,"app":231},"012b7fc0-97e9-4008-9ea6-c66daa2dcb93","Sharing settings accordion","An accordion component with two sections for sharing settings. The first section is collapsed, and the second is expanded, revealing a form with three text inputs for custom link variables.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F9b40f20f-a6d3-46a9-8107-365254e294b2.png",824,748,"Sharing settings accordion from Arcade",[227],{"id":228,"title":229,"slug":230},168,"Accordion","accordion",{"slug":31,"title":30,"logo":33,"categories":232},[],[],[235,238,241,244,247,250],{"label":236,"to":237},"Arcade product screens","\u002Fexamples\u002Fapps\u002Farcade\u002Fscreens",{"label":239,"to":240},"Arcade marketing pages","\u002Fexamples\u002Fapps\u002Farcade\u002Fmarketing",{"label":242,"to":243},"Arcade user flows","\u002Fexamples\u002Fapps\u002Farcade\u002Fflows",{"label":245,"to":246},"Design app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fdesign",{"label":248,"to":249},"Marketing app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fmarketing",{"label":251,"to":252},"Artificial Intelligence app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fartificial-intelligence",{"published_at":254,"updated_at":255},"2024-03-13T11:10:22.000Z","2026-09-22T00:10:13.000Z"]