[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fslack\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":217,"links":218,"dates":237},"\u002Fexamples\u002Fapps\u002Fslack\u002Fcomponents","detail","components",true,{"title":9,"description":10,"og_image":11},"Slack UI components examples - Nicelydone","Browse Slack UI component design examples. Preview individual interface elements and explore related component categories. Be less busy","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F727c42b2-f3f8-45cd-8808-f6bb2f8e47ba.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},"Slack design examples","\u002Fexamples\u002Fapps\u002Fslack",{"label":23,"to":4},"Slack 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},"Slack","slack","Be less busy","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fslack-fd2f6962.png","https:\u002F\u002Fslack.com","SlackHQ",[36,40,44],{"id":37,"title":38,"slug":39},23,"Collaboration","collaboration",{"id":41,"title":42,"slug":43},42,"Messaging","messaging",{"id":45,"title":46,"slug":47},82,"Communication","communication",[49,64,79,94,109,122,135,150,163,178,188,203],{"uuid":50,"title":51,"description":52,"canonical_path":4,"image":11,"width":53,"height":54,"image_alt":55,"kind":56,"categories":57,"app":62},"b38572e9-00e6-451c-baef-09670229fabe","New View Configuration Popover","A popover form for creating a new view in a list. It includes a text input for the view name, a radio group styled as cards to select the layout (Table or Board), a dropdown to select a grouping option, and action buttons to cancel or create the view.",913,1124,"New View Configuration Popover from Slack","component",[58],{"id":59,"title":60,"slug":61},190,"Dropdown menu","dropdown-menu",{"slug":30,"title":29,"logo":32,"categories":63},[],{"uuid":65,"title":66,"description":67,"canonical_path":4,"image":68,"width":69,"height":70,"image_alt":71,"kind":56,"categories":72,"app":77},"7917706e-59b0-43aa-9498-dd245f9a7391","Slack UI component","A list of items with people, date, link and status information.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F5e7c8e1a-d6a8-4dd6-82e1-6d4d9fea48db.png",2292,1023,"UI component from Slack",[73],{"id":74,"title":75,"slug":76},248,"Table","table-2",{"slug":30,"title":29,"logo":32,"categories":78},[],{"uuid":80,"title":81,"description":82,"canonical_path":4,"image":83,"width":84,"height":85,"image_alt":86,"kind":56,"categories":87,"app":92},"41148db8-9c2e-405e-8280-88813fa622f6","Trial Feature Alert","A simple alert box informing the user that the feature they are using is a paid feature, currently available during their free trial until a specific date.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F5a9bc0b4-b007-4cea-843b-d6192590128e.png",1056,268,"Trial Feature Alert from Slack",[88],{"id":89,"title":90,"slug":91},244,"Message","message",{"slug":30,"title":29,"logo":32,"categories":93},[],{"uuid":95,"title":96,"description":97,"canonical_path":4,"image":98,"width":99,"height":100,"image_alt":101,"kind":56,"categories":102,"app":107},"7ed2e7f1-2359-413e-8fa3-18b5c9c5c2da","Success Modal with Confetti","A modal dialog confirming the successful publication of a workflow, featuring a central illustration, a summary of the trigger, and a confetti animation overlaying the entire screen. It includes primary and secondary action buttons.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F4deded43-3ac9-4c9f-ad13-0c17935a9755.png",3272,2034,"Success Modal with Confetti from Slack",[103],{"id":104,"title":105,"slug":106},280,"Confetti","confetti",{"slug":30,"title":29,"logo":32,"categories":108},[],{"uuid":110,"title":66,"description":111,"canonical_path":4,"image":112,"width":113,"height":114,"image_alt":71,"kind":56,"categories":115,"app":120},"b82d997b-117c-4a0b-b335-ae74a60858bf","A workflow automation interface.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F28ada120-26cb-4cf9-a9c3-8cdb460661ff.png",1496,795,[116],{"id":117,"title":118,"slug":119},217,"Query builder","query-builder",{"slug":30,"title":29,"logo":32,"categories":121},[],{"uuid":123,"title":66,"description":124,"canonical_path":4,"image":125,"width":126,"height":127,"image_alt":71,"kind":56,"categories":128,"app":133},"104b28f7-c6cc-471f-b22f-28b6cba97739","A modal asking the user to publish their workflow.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F8d845e80-f51c-4d83-b9a6-5e1a40aaeb0a.png",899,574,[129],{"id":130,"title":131,"slug":132},254,"Tooltip","tooltip-element",{"slug":30,"title":29,"logo":32,"categories":134},[],{"uuid":136,"title":137,"description":138,"canonical_path":4,"image":139,"width":140,"height":141,"image_alt":142,"kind":56,"categories":143,"app":148},"280dc1ce-80f5-4fef-aedc-581a31013a5d","Onboarding step header","A header section for an onboarding flow, displaying the current step number, a progress bar, a main title, and a brief explanatory description.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F81118b58-11bc-4e51-a4b6-6b9111ef480e.png",1182,599,"Onboarding step header from Slack",[144],{"id":145,"title":146,"slug":147},213,"Progress indicator","progress-indicator",{"slug":30,"title":29,"logo":32,"categories":149},[],{"uuid":151,"title":66,"description":152,"canonical_path":4,"image":153,"width":154,"height":155,"image_alt":71,"kind":56,"categories":156,"app":161},"a7d87f95-2e03-4a04-9798-81ad96a790d0","Landing page promoting external collaboration features.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ffd28327b-f50b-4321-b1b7-78f75f8a3699.png",2258,1033,[157],{"id":158,"title":159,"slug":160},255,"Upgrade your plan","upgrade-your-plan",{"slug":30,"title":29,"logo":32,"categories":162},[],{"uuid":164,"title":165,"description":166,"canonical_path":4,"image":167,"width":168,"height":169,"image_alt":170,"kind":56,"categories":171,"app":176},"b2d91cdb-3db2-4fdd-abb7-7f10ddc4823d","Horizontal Informational Stepper","A three-step horizontal informational stepper explaining a process. Each step features a numbered blue circle, a bold title, and a descriptive paragraph, connected by a dashed line.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F4780a1a3-1058-448b-a16a-1bfffb01bc8d.png",1597,581,"Horizontal Informational Stepper from Slack",[172],{"id":173,"title":174,"slug":175},227,"Stepper","stepper",{"slug":30,"title":29,"logo":32,"categories":177},[],{"uuid":179,"title":66,"description":180,"canonical_path":4,"image":181,"width":182,"height":183,"image_alt":71,"kind":56,"categories":184,"app":186},"a84c0b86-d5b4-4f6b-aca8-353962886141","A table displaying account permissions for different user roles.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F91f63604-2511-4e2d-bae6-93800d20dd91.png",2667,1799,[185],{"id":74,"title":75,"slug":76},{"slug":30,"title":29,"logo":32,"categories":187},[],{"uuid":189,"title":190,"description":191,"canonical_path":4,"image":192,"width":193,"height":194,"image_alt":195,"kind":56,"categories":196,"app":201},"e472b933-f7ae-4a7f-8486-c9acab09b448","Usage KPI Row","A row of three key performance indicators (KPIs) showing all-time usage metrics. Each KPI includes a title, a large numeric value, a descriptive subtext with a link, and a segmented progress bar indicating usage against a limit.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F5dd5b446-632b-4709-a3e6-19a7d53a3709.png",2274,632,"Usage KPI Row from Slack",[197],{"id":198,"title":199,"slug":200},186,"Charts","charts",{"slug":30,"title":29,"logo":32,"categories":202},[],{"uuid":204,"title":205,"description":206,"canonical_path":4,"image":207,"width":208,"height":89,"image_alt":209,"kind":56,"categories":210,"app":215},"f9ad757d-3364-4ced-8b6a-d5e627a61093","Header with Tabs","A header section featuring a title, action icons, and a tabbed navigation bar for filtering content by status.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F4effc50b-ac0a-4c75-bd41-9260207596a0.png",1076,"Header with Tabs from Slack",[211],{"id":212,"title":213,"slug":214},233,"Tabs","tabs",{"slug":30,"title":29,"logo":32,"categories":216},[],[],[219,222,225,228,231,234],{"label":220,"to":221},"Slack product screens","\u002Fexamples\u002Fapps\u002Fslack\u002Fscreens",{"label":223,"to":224},"Slack marketing pages","\u002Fexamples\u002Fapps\u002Fslack\u002Fmarketing",{"label":226,"to":227},"Slack user flows","\u002Fexamples\u002Fapps\u002Fslack\u002Fflows",{"label":229,"to":230},"Collaboration app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fcollaboration",{"label":232,"to":233},"Messaging app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fmessaging",{"label":235,"to":236},"Communication app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fcommunication",{"published_at":238,"updated_at":239},"2016-07-07T08:45:34.000Z","2026-09-13T13:02:39.000Z"]