[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fmake\u002Fcomponents":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":48,"showcases":220,"links":221,"dates":240},"\u002Fexamples\u002Fapps\u002Fmake\u002Fcomponents","detail","components",true,{"title":9,"description":10,"og_image":11},"Make UI components examples - Nicelydone","Browse Make UI component design examples. Preview individual interface elements and explore related component categories. Connect apps & design workflows","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F525c594a-67ad-44f4-96fa-ce76581f0c4c.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},"Make design examples","\u002Fexamples\u002Fapps\u002Fmake",{"label":23,"to":4},"Make 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,"twitter_username":34,"categories":35},"Make","make","Connect apps & design workflows","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fmake-627bffaa.png","https:\u002F\u002Fwww.make.com","make_hqn",[36,40,44],{"id":37,"title":38,"slug":39},30,"Productivity","productivity",{"id":41,"title":42,"slug":43},96,"No code","no-code",{"id":45,"title":46,"slug":47},105,"Workflow Automation","workflow-automation",[49,63,78,93,108,123,138,153,165,179,194,205],{"uuid":50,"title":51,"description":52,"canonical_path":4,"image":11,"width":53,"height":54,"image_alt":55,"kind":56,"categories":57,"app":61},"ad99ca12-2f97-4084-9336-bf1347d97e70","Hero section","A hero section with a dark purple background, featuring a large headline, a subheadline, a prominent call-to-action button, and a top navigation bar.",3024,1296,"Hero section from Make","component",[58],{"id":59,"title":51,"slug":60},197,"hero-section",{"slug":30,"title":29,"logo":32,"categories":62},[],{"uuid":64,"title":65,"description":66,"canonical_path":4,"image":67,"width":68,"height":69,"image_alt":70,"kind":56,"categories":71,"app":76},"7954e87b-a6b8-4508-beba-7586d8188c1f","Line chart","A line chart displaying two data series over time, with a significant spike at the end of the timeline.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fcd9c1953-4eff-4688-976e-408b61d00045.png",2270,535,"Line chart from Make",[72],{"id":73,"title":74,"slug":75},186,"Charts","charts",{"slug":30,"title":29,"logo":32,"categories":77},[],{"uuid":79,"title":80,"description":81,"canonical_path":4,"image":82,"width":83,"height":84,"image_alt":85,"kind":56,"categories":86,"app":91},"1e80e10f-0c49-4b31-b3ba-1acd776def34","Scenario Editor Toolbar","A toolbar containing a primary 'Run once' action, scheduling controls, and grouped utility icons for managing a workflow scenario.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F1b537a88-f105-402c-886f-667167d0508c.png",2055,513,"Scenario Editor Toolbar from Make",[87],{"id":88,"title":89,"slug":90},246,"Toolbox","toolbox",{"slug":30,"title":29,"logo":32,"categories":92},[],{"uuid":94,"title":95,"description":96,"canonical_path":4,"image":97,"width":98,"height":99,"image_alt":100,"kind":56,"categories":101,"app":106},"aa8e0a38-55c5-498d-8fb9-cce9ebf39f04","Onboarding checklist","An onboarding checklist showing a progress bar and a completed task.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F3765ca7b-d25c-4918-9c78-2f2740fdcd39.png",752,512,"Onboarding checklist from Make",[102],{"id":103,"title":104,"slug":105},213,"Progress indicator","progress-indicator",{"slug":30,"title":29,"logo":32,"categories":107},[],{"uuid":109,"title":110,"description":111,"canonical_path":4,"image":112,"width":113,"height":114,"image_alt":115,"kind":56,"categories":116,"app":121},"24633d3d-9015-49d6-9c6a-2999bfdd6c70","Billing cycle toggle","A horizontal toggle switch used to select between monthly and yearly billing cycles. The switch is currently set to the 'Billed yearly' option, which is highlighted in bold text.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F97984f2f-d24f-46df-8b47-c7dec9c4ddfc.png",692,175,"Billing cycle toggle from Make",[117],{"id":118,"title":119,"slug":120},236,"Toggle\u002FSwitch","toggle-switch",{"slug":30,"title":29,"logo":32,"categories":122},[],{"uuid":124,"title":125,"description":126,"canonical_path":4,"image":127,"width":128,"height":129,"image_alt":130,"kind":56,"categories":131,"app":136},"e4c1580a-fc22-43b0-aaee-6dca935665a5","Organization Header","A top header section displaying the organization name, a primary action button to create a new scenario, an organization settings dropdown, and a horizontal tab navigation menu.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F50d56cd7-f01e-4354-93ab-dce4ba900a2d.png",3015,238,"Organization Header from Make",[132],{"id":133,"title":134,"slug":135},240,"Horizontal navigation","horizontal-navigation",{"slug":30,"title":29,"logo":32,"categories":137},[],{"uuid":139,"title":140,"description":141,"canonical_path":4,"image":142,"width":143,"height":144,"image_alt":145,"kind":56,"categories":146,"app":151},"19114259-6c84-4667-a9ba-15fa82cbe227","Sidebar navigation","A vertical sidebar navigation menu with a purple background, featuring a logo, organization switcher, primary navigation links, utility links, and a user profile section.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F56e432f4-a199-440c-9c71-aa2fc6e64580.png",551,1679,"Sidebar navigation from Make",[147],{"id":148,"title":149,"slug":150},209,"Vertical navigation","vertical-navigation",{"slug":30,"title":29,"logo":32,"categories":152},[],{"uuid":154,"title":155,"description":156,"canonical_path":4,"image":157,"width":158,"height":159,"image_alt":160,"kind":56,"categories":161,"app":163},"f5bbc958-5278-4982-baaa-467d5cc91f36","Onboarding header with progress","A header section showing the Make logo, a segmented progress bar indicating the current step, and a title with a subtitle asking the user about their use case.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F92bf96ba-b577-4235-9af3-99c2a3ffd8aa.png",1718,577,"Onboarding header with progress from Make",[162],{"id":103,"title":104,"slug":105},{"slug":30,"title":29,"logo":32,"categories":164},[],{"uuid":166,"title":167,"description":168,"canonical_path":4,"image":169,"width":170,"height":129,"image_alt":171,"kind":56,"categories":172,"app":177},"0b9500c8-579a-4fd9-9c75-62aa1067e984","Social Login Buttons","A row of social login options featuring a prominent Google button alongside smaller Facebook and GitHub icon buttons.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F75daa41a-461c-426f-aae4-6da231ff0f27.png",874,"Social Login Buttons from Make",[173],{"id":174,"title":175,"slug":176},289,"Social login button","social-login-button",{"slug":30,"title":29,"logo":32,"categories":178},[],{"uuid":180,"title":181,"description":182,"canonical_path":4,"image":183,"width":184,"height":185,"image_alt":186,"kind":56,"categories":187,"app":192},"430ec672-bbb2-4c31-ab6e-9cb0fd8d3e4c","Success Alert","A success alert box displaying a confirmation message with a checkmark icon.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F1f664332-09c0-4a0c-8570-270106256523.png",875,324,"Success Alert from Make",[188],{"id":189,"title":190,"slug":191},167,"Alert","alert",{"slug":30,"title":29,"logo":32,"categories":193},[],{"uuid":195,"title":196,"description":197,"canonical_path":4,"image":198,"width":184,"height":199,"image_alt":200,"kind":56,"categories":201,"app":203},"a5dc8268-f091-4623-93a3-0a2a19d9d370","Social login buttons","A vertical stack of four social login buttons for Google, Facebook, GitHub, and SSO.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F278323d6-953c-4912-8253-ba1fff1c4b69.png",616,"Social login buttons from Make",[202],{"id":174,"title":175,"slug":176},{"slug":30,"title":29,"logo":32,"categories":204},[],{"uuid":206,"title":207,"description":208,"canonical_path":4,"image":209,"width":210,"height":211,"image_alt":212,"kind":56,"categories":213,"app":218},"1bc7eecf-95a8-44fb-a9e0-91c4dc58ecfb","Template Card","A card displaying a workflow automation template, featuring app icons, a title, a brief description, and a call-to-action button.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F5ee1dee0-9a3f-40fe-bf56-aefa7bb37a68.png",693,779,"Template Card from Make",[214],{"id":215,"title":216,"slug":217},174,"Card","card",{"slug":30,"title":29,"logo":32,"categories":219},[],[],[222,225,228,231,234,237],{"label":223,"to":224},"Make product screens","\u002Fexamples\u002Fapps\u002Fmake\u002Fscreens",{"label":226,"to":227},"Make marketing pages","\u002Fexamples\u002Fapps\u002Fmake\u002Fmarketing",{"label":229,"to":230},"Make user flows","\u002Fexamples\u002Fapps\u002Fmake\u002Fflows",{"label":232,"to":233},"Productivity app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fproductivity",{"label":235,"to":236},"No code app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fno-code",{"label":238,"to":239},"Workflow Automation app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fworkflow-automation",{"published_at":241,"updated_at":242},"2024-06-03T08:13:40.000Z","2026-09-26T00:10:31.000Z"]