[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fclickup\u002Fcomponents":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":55,"showcases":221,"links":222,"dates":241},"\u002Fexamples\u002Fapps\u002Fclickup\u002Fcomponents","detail","components",true,{"title":9,"description":10,"og_image":11},"ClickUp UI components examples - Nicelydone","Browse ClickUp UI component design examples. Preview individual interface elements and explore related component categories. The everything app, for work","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fc6f5a12d-35ee-49e9-9359-508ddfaa5f5f.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},"ClickUp design examples","\u002Fexamples\u002Fapps\u002Fclickup",{"label":23,"to":4},"ClickUp 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":30,"categories":34},"ClickUp","clickup","The everything app, for work","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fclickup-771d7d6d.png","https:\u002F\u002Fclickup.com",[35,39,43,47,51],{"id":36,"title":37,"slug":38},30,"Productivity","productivity",{"id":40,"title":41,"slug":42},86,"Product management","product-management",{"id":44,"title":45,"slug":46},22,"Knowledge Management","knowledge-management",{"id":48,"title":49,"slug":50},23,"Collaboration","collaboration",{"id":52,"title":53,"slug":54},29,"Task Management","task-management",[56,71,86,101,116,128,143,155,167,182,194,209],{"uuid":57,"title":58,"description":59,"canonical_path":4,"image":11,"width":60,"height":61,"image_alt":62,"kind":63,"categories":64,"app":69},"1be1bcc0-e934-4acd-9411-c5473fd1db22","Pricing Table","A four-column pricing table comparing subscription tiers. The current plan is highlighted with a gradient border and a 'Popular' badge. Each tier lists a price, a call-to-action button, and a checklist of included features.",2454,2394,"Pricing Table from ClickUp","component",[65],{"id":66,"title":67,"slug":68},303,"Pricing section","pricing-section",{"slug":30,"title":29,"logo":32,"categories":70},[],{"uuid":72,"title":73,"description":74,"canonical_path":4,"image":75,"width":76,"height":77,"image_alt":78,"kind":63,"categories":79,"app":84},"e587c13c-2dbc-4863-a84e-826407f228cd","AI Upgrade Banner","A horizontal banner promoting an AI add-on for paid plans. It features a dark background, an AI icon, promotional text with a crossed-out original price, a 'Learn more' link, and a primary 'Choose plan' button.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F84b1b01b-4a1a-4095-9655-d4a6911e50e0.png",2482,412,"AI Upgrade Banner from ClickUp",[80],{"id":81,"title":82,"slug":83},294,"Artificial intelligence","ai",{"slug":30,"title":29,"logo":32,"categories":85},[],{"uuid":87,"title":88,"description":89,"canonical_path":4,"image":90,"width":91,"height":92,"image_alt":93,"kind":63,"categories":94,"app":99},"2321579d-cf7a-45ce-81f8-14a1ef4d6213","Notepad Empty State Drawer","An empty state drawer for a notepad feature, prompting the user to create their first personal note.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F79880b35-69b0-4022-bb73-66eb808a4807.png",905,1108,"Notepad Empty State Drawer from ClickUp",[95],{"id":96,"title":97,"slug":98},302,"Empty state","emptystate",{"slug":30,"title":29,"logo":32,"categories":100},[],{"uuid":102,"title":103,"description":104,"canonical_path":4,"image":105,"width":106,"height":107,"image_alt":108,"kind":63,"categories":109,"app":114},"f4ee9e11-da45-4c1d-b8da-b0ebe2ae631d","Activity Feed Panel","A panel displaying a chronological list of task activities, including status changes and subtask creations, with a right-hand sidebar for navigation.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F810ecceb-6ce9-4284-984f-a3a538014654.png",957,574,"Activity Feed Panel from ClickUp",[110],{"id":111,"title":112,"slug":113},249,"Timeline & history","timeline-history",{"slug":30,"title":29,"logo":32,"categories":115},[],{"uuid":117,"title":118,"description":119,"canonical_path":4,"image":120,"width":121,"height":122,"image_alt":123,"kind":63,"categories":124,"app":126},"47d20335-90f4-4856-8919-e4e3265872a3","AI Prompt Suggestions","A horizontal bar offering AI prompt suggestions. It features an AI icon and a sentence with clickable inline actions to trigger specific AI tasks.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F59b6ce0c-1374-42d4-9cdd-a84fba316998.png",2196,353,"AI Prompt Suggestions from ClickUp",[125],{"id":81,"title":82,"slug":83},{"slug":30,"title":29,"logo":32,"categories":127},[],{"uuid":129,"title":130,"description":131,"canonical_path":4,"image":132,"width":133,"height":134,"image_alt":135,"kind":63,"categories":136,"app":141},"febcaa02-ef97-477a-b90d-648216931b60","Status Change Toast","A toast notification confirming a task status change to 'In Progress', featuring an undo action and a close button.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Faead0489-7815-47a4-826e-58056b4fc310.png",771,351,"Status Change Toast from ClickUp",[137],{"id":138,"title":139,"slug":140},247,"Notification Toast","notification-element",{"slug":30,"title":29,"logo":32,"categories":142},[],{"uuid":144,"title":145,"description":146,"canonical_path":4,"image":147,"width":148,"height":149,"image_alt":150,"kind":63,"categories":151,"app":153},"f949cf6b-3043-4193-8df1-f79a813f5243","ClickUp UI component","This is a modal for an AI assistant that helps users manage their tasks.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ff0550fca-cd64-4466-999c-024fbfce5b98.png",1699,1777,"UI component from ClickUp",[152],{"id":81,"title":82,"slug":83},{"slug":30,"title":29,"logo":32,"categories":154},[],{"uuid":156,"title":157,"description":158,"canonical_path":4,"image":159,"width":160,"height":161,"image_alt":162,"kind":63,"categories":163,"app":165},"13ee2e88-28a4-41e1-aa0e-1d430696bc11","Empty Folder State","An empty state message indicating a folder has no lists, featuring an illustrative graphic of lists, a descriptive text prompt, and a primary call-to-action button to create a new list.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F9c75979d-2a90-480b-b751-ca762994b36e.png",1268,1045,"Empty Folder State from ClickUp",[164],{"id":96,"title":97,"slug":98},{"slug":30,"title":29,"logo":32,"categories":166},[],{"uuid":168,"title":169,"description":170,"canonical_path":4,"image":171,"width":172,"height":173,"image_alt":174,"kind":63,"categories":175,"app":180},"fbfda011-7d94-4907-8d45-581235804631","Segmented Control with Description","A segmented control allowing the user to choose between 'Everything' and 'Customize' when copying a project space. The 'Everything' option is selected, and a description below explains the consequence of this choice.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fb6105266-545e-4cf4-9c9e-88b3afb6d81f.png",1240,477,"Segmented Control with Description from ClickUp",[176],{"id":177,"title":178,"slug":179},218,"Segmented control","segmented-control",{"slug":30,"title":29,"logo":32,"categories":181},[],{"uuid":183,"title":184,"description":185,"canonical_path":4,"image":186,"width":187,"height":188,"image_alt":189,"kind":63,"categories":190,"app":192},"e6ec935a-b2b7-42eb-8e53-83a80702cbc5","Template Creation Toast","A toast notification informing the user that a template is being created. It includes an icon, a title, a descriptive message, and a close button.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fc13907c5-0fd7-4768-b8a1-9cc242b83b58.png",786,336,"Template Creation Toast from ClickUp",[191],{"id":138,"title":139,"slug":140},{"slug":30,"title":29,"logo":32,"categories":193},[],{"uuid":195,"title":196,"description":197,"canonical_path":4,"image":198,"width":199,"height":200,"image_alt":201,"kind":63,"categories":202,"app":207},"6bbf7a9c-0dbc-4ed1-82bf-212b43175650","Nested Color and Icon Picker Menu","A context menu with a nested popover for selecting a color and an icon. The primary menu lists space settings, while the nested popover provides a grid of color swatches and a searchable grid of icons.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fa71eaad6-5708-41b8-b07c-caae500ff486.png",1203,878,"Nested Color and Icon Picker Menu from ClickUp",[203],{"id":204,"title":205,"slug":206},183,"Color picker","color-picker",{"slug":30,"title":29,"logo":32,"categories":208},[],{"uuid":210,"title":211,"description":212,"canonical_path":4,"image":213,"width":214,"height":215,"image_alt":216,"kind":63,"categories":217,"app":219},"ae0f2705-371f-40b5-914f-60e9ceea8b57","Color Swatch Picker","A color selection component displaying a grid of circular color swatches and an eyedropper tool for custom color selection.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F23cc9925-4911-4752-b919-782c05b95899.png",560,265,"Color Swatch Picker from ClickUp",[218],{"id":204,"title":205,"slug":206},{"slug":30,"title":29,"logo":32,"categories":220},[],[],[223,226,229,232,235,238],{"label":224,"to":225},"ClickUp product screens","\u002Fexamples\u002Fapps\u002Fclickup\u002Fscreens",{"label":227,"to":228},"ClickUp marketing pages","\u002Fexamples\u002Fapps\u002Fclickup\u002Fmarketing",{"label":230,"to":231},"ClickUp user flows","\u002Fexamples\u002Fapps\u002Fclickup\u002Fflows",{"label":233,"to":234},"Productivity app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fproductivity",{"label":236,"to":237},"Product management app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fproduct-management",{"label":239,"to":240},"Knowledge Management app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fknowledge-management",{"published_at":242,"updated_at":243},"2024-11-25T11:07:57.000Z","2026-09-13T13:02:39.000Z"]