[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Ftags\u002Fdatepicker":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"totals":8,"category":11,"seo":15,"breadcrumbs":19,"content":28,"examples":33,"showcases":563,"links":564,"dates":625},"\u002Fexamples\u002Ftags\u002Fdatepicker","collection","screens",true,{"example_count":9,"app_count":10},1043,125,{"id":12,"title":13,"description":14},23791,"Datepicker","",{"title":16,"description":17,"og_image":18},"Datepicker screen examples - Nicelydone","Datepicker screen design examples from SaaS apps. Browse examples from Workflow, Notion Mail, Reflect.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F7bc90c13-7724-47e6-ac63-6e18ac32d22b.png",[20,23,26],{"label":21,"to":22},"Examples","\u002Fexamples",{"label":24,"to":25},"tags","\u002Fexamples\u002Ftags",{"label":27,"to":4},"Datepicker screen examples",{"title":27,"eyebrow":29,"description":17,"sections":30,"body":31},"Tag category",[],[32],"1043 screens",[34,110,150,200,240,283,332,370,401,433,482,525],{"uuid":35,"title":36,"description":37,"canonical_path":38,"image":18,"width":39,"height":40,"image_alt":41,"published_at":42,"kind":43,"patterns":44,"component_categories":68,"app":93},"7bc90c13-7724-47e6-ac63-6e18ac32d22b","Workflow","Modal where the user creates a new task, setting properties, adding a briefing, and attaching files.","\u002Fexamples\u002Fapps\u002Fworkflow\u002Fscreens",3024,1780,"Workflow from Workflow","2025-09-30T08:25:02.000Z","screen",[45,54,60],{"id":46,"label":47,"slug":48,"rank":49,"group":50},7,"Add & Create","add-and-create",0,{"id":51,"label":52,"slug":53},2,"Actions","actions",{"id":55,"label":56,"slug":57,"rank":58,"group":59},25,"Upload & Download","upload-and-download",1,{"id":51,"label":52,"slug":53},{"id":61,"label":62,"slug":63,"rank":51,"group":64},129,"Workflow Builder","workflow-builder",{"id":65,"label":66,"slug":67},13,"Workflow & Automation","workflow-and-automation",[69,73,77,81,85,89],{"id":70,"title":71,"slug":72},240,"Horizontal navigation","horizontal-navigation",{"id":74,"title":75,"slug":76},284,"Modal","modal",{"id":78,"title":79,"slug":80},233,"Tabs","tabs",{"id":82,"title":83,"slug":84},260,"Badge","badge",{"id":86,"title":87,"slug":88},169,"Avatar","avatar",{"id":90,"title":91,"slug":92},175,"Button","button",{"slug":94,"title":36,"logo":95,"baseline":96,"categories":97},"workflow","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fworkflow-n6ecc4wx.png","Design feedback and revisions, all in one place",[98,102,106],{"id":99,"title":100,"slug":101},8,"Design","design",{"id":103,"title":104,"slug":105},23,"Collaboration","collaboration",{"id":107,"title":108,"slug":109},35,"Feedback","feedback",{"uuid":111,"title":112,"description":113,"canonical_path":114,"image":115,"width":39,"height":116,"image_alt":117,"published_at":118,"kind":43,"patterns":119,"component_categories":128,"app":137},"8d47b4d3-22b0-437a-a6c1-3b8e319a8e9d","Notion Mail","Product page section highlighting the built-in scheduling feature with a mockup showing an interactive calendar embedded directly in the email composer.","\u002Fexamples\u002Fapps\u002Fnotion-mail\u002Fmarketing","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F8d47b4d3-22b0-437a-a6c1-3b8e319a8e9d.png",1714,"Notion Mail from Notion Mail","2025-04-21T10:48:03.000Z",[120],{"id":121,"label":122,"slug":123,"rank":49,"group":124},137,"Product Page","product-page",{"id":125,"label":126,"slug":127},15,"Marketing Page Types","marketing-page-types",[129,133],{"id":130,"title":131,"slug":132},168,"Accordion","accordion",{"id":134,"title":135,"slug":136},174,"Card","card",{"slug":138,"title":112,"logo":139,"baseline":140,"categories":141},"notion-mail","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fnotion-mail-6kbmdt89.png","The inbox that thinks like you",[142,146],{"id":143,"title":144,"slug":145},92,"Email","email",{"id":147,"title":148,"slug":149},80,"Artificial Intelligence","artificial-intelligence",{"uuid":151,"title":152,"description":153,"canonical_path":154,"image":155,"width":39,"height":156,"image_alt":157,"published_at":158,"kind":43,"patterns":159,"component_categories":180,"app":183},"e91b0bc6-002b-4aa0-982b-2a297146898e","Reflect","Content editor for a daily note showing bulleted lists, task checkboxes, a calendar sidebar, and a navigation menu with an open user settings dropdown.","\u002Fexamples\u002Fapps\u002Freflect\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fe91b0bc6-002b-4aa0-982b-2a297146898e.png",1778,"Reflect from Reflect","2025-03-24T15:32:15.000Z",[160,167,172],{"id":161,"label":162,"slug":163,"rank":49,"group":164},81,"Home","home",{"id":99,"label":165,"slug":166},"Pages & Content","pages-and-content",{"id":168,"label":169,"slug":170,"rank":58,"group":171},85,"Tasks","tasks",{"id":99,"label":165,"slug":166},{"id":173,"label":174,"slug":175,"rank":51,"group":176},51,"Calendar","calendar",{"id":177,"label":178,"slug":179},5,"Media & Tools","media-and-tools",[181,182],{"id":86,"title":87,"slug":88},{"id":90,"title":91,"slug":92},{"slug":184,"title":152,"logo":185,"baseline":186,"categories":187},"reflect","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Freflect-98047e97.png","Keep track of your notes, books, and meetings.",[188,192,196],{"id":189,"title":190,"slug":191},30,"Productivity","productivity",{"id":193,"title":194,"slug":195},22,"Knowledge Management","knowledge-management",{"id":197,"title":198,"slug":199},59,"Writing tools","writing-tools",{"uuid":201,"title":202,"description":203,"canonical_path":204,"image":205,"width":39,"height":156,"image_alt":206,"published_at":207,"kind":43,"patterns":208,"component_categories":226,"app":230},"513e1519-f053-4e45-8c1d-df3e021dc7fb","Delete transaction history in synced accounts","Settings page where the user can download their transaction history and account balances as CSVs, or delete historical data before a specific date.","\u002Fexamples\u002Fapps\u002Fmonarch\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F513e1519-f053-4e45-8c1d-df3e021dc7fb.png","Delete transaction history in synced accounts from Monarch","2025-03-17T14:09:52.000Z",[209,217,222],{"id":210,"label":211,"slug":212,"rank":49,"group":213},102,"Settings","settings",{"id":214,"label":215,"slug":216},10,"Settings & Admin","settings-and-admin",{"id":218,"label":219,"slug":220,"rank":58,"group":221},9,"Delete","delete",{"id":51,"label":52,"slug":53},{"id":125,"label":223,"slug":224,"rank":51,"group":225},"Import & Export","import-and-export",{"id":51,"label":52,"slug":53},[227,228,229],{"id":134,"title":135,"slug":136},{"id":86,"title":87,"slug":88},{"id":90,"title":91,"slug":92},{"slug":231,"title":232,"logo":233,"baseline":234,"categories":235},"monarch","Monarch","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fmonarch-58e7e32a.png","The modern way to manage money",[236],{"id":237,"title":238,"slug":239},36,"Finance","finance",{"uuid":241,"title":242,"description":243,"canonical_path":244,"image":245,"width":39,"height":156,"image_alt":246,"published_at":247,"kind":43,"patterns":248,"component_categories":266,"app":270},"eff4d2e0-37c1-44f8-819c-91ae97173e31","Assembly","Inbox page where the user manages pending approvals and tracks requests they have sent, currently filtering by a date range.","\u002Fexamples\u002Fapps\u002Fmeet-assembly\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Feff4d2e0-37c1-44f8-819c-91ae97173e31.png","Assembly from Assembly","2025-03-17T13:29:41.000Z",[249,254,262],{"id":250,"label":251,"slug":252,"rank":49,"group":253},123,"Approval Flow","approval-flow",{"id":65,"label":66,"slug":67},{"id":255,"label":256,"slug":257,"rank":58,"group":258},47,"Table","table",{"id":259,"label":260,"slug":261},4,"Data & Analysis","data-and-analysis",{"id":65,"label":263,"slug":264,"rank":51,"group":265},"Filter & Sort","filter-and-sort",{"id":51,"label":52,"slug":53},[267,268,269],{"id":82,"title":83,"slug":84},{"id":86,"title":87,"slug":88},{"id":90,"title":91,"slug":92},{"slug":271,"title":242,"logo":272,"baseline":273,"categories":274},"meet-assembly","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fassembly-s-8b4489ec.png","Manage your social content like magic",[275,279,280],{"id":276,"title":277,"slug":278},14,"Social","social",{"id":103,"title":104,"slug":105},{"id":55,"title":281,"slug":282},"Marketing","marketing",{"uuid":284,"title":285,"description":286,"canonical_path":287,"image":288,"width":39,"height":156,"image_alt":289,"published_at":290,"kind":43,"patterns":291,"component_categories":307,"app":317},"13ba7be7-feb6-4fe2-af68-b87ea291bb24","Front (2)","Combined inbox view where the user reads an email thread about design ethics while simultaneously drafting a related calendar event in the right sidebar.","\u002Fexamples\u002Fapps\u002Ffront\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F13ba7be7-feb6-4fe2-af68-b87ea291bb24.png","Front (2) from Front","2025-03-03T14:56:15.000Z",[292,294,302],{"id":173,"label":174,"slug":175,"rank":49,"group":293},{"id":177,"label":178,"slug":179},{"id":295,"label":296,"slug":297,"rank":58,"group":298},109,"Messages","messages",{"id":299,"label":300,"slug":301},11,"Social & Collaboration","social-and-collaboration",{"id":303,"label":304,"slug":305,"rank":51,"group":306},97,"Integrations","integrations",{"id":214,"label":215,"slug":216},[308,312,313,314,315,316],{"id":309,"title":310,"slug":311},277,"Button group","button-group",{"id":70,"title":71,"slug":72},{"id":78,"title":79,"slug":80},{"id":82,"title":83,"slug":84},{"id":86,"title":87,"slug":88},{"id":90,"title":91,"slug":92},{"slug":318,"title":319,"logo":320,"baseline":321,"categories":322},"front","Front","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Ffront-f25c6b6e.png","Email redesigned for teams",[323,324,327,331],{"id":103,"title":104,"slug":105},{"id":255,"title":325,"slug":326},"Customer Service","customer-service",{"id":328,"title":329,"slug":330},82,"Communication","communication",{"id":143,"title":144,"slug":145},{"uuid":333,"title":334,"description":335,"canonical_path":336,"image":337,"width":39,"height":156,"image_alt":338,"published_at":339,"kind":43,"patterns":340,"component_categories":353,"app":359},"e305f889-fa92-4a30-b222-952f3cb283ce","Simple checkout | Flodesk","Design editor modal where the user configures product details, expiration dates, and waitlist settings for a checkout page.","\u002Fexamples\u002Fapps\u002Fflodesk\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fe305f889-fa92-4a30-b222-952f3cb283ce.png","Simple checkout | Flodesk from Flodesk","2025-02-24T15:36:57.000Z",[341,348],{"id":342,"label":343,"slug":344,"rank":49,"group":345},130,"Checkout","checkout",{"id":276,"label":346,"slug":347},"Payments & Checkout","payments-and-checkout",{"id":349,"label":350,"slug":351,"rank":58,"group":352},131,"Payment Form","payment-form",{"id":276,"label":346,"slug":347},[354,355,356,357,358],{"id":70,"title":71,"slug":72},{"id":74,"title":75,"slug":76},{"id":78,"title":79,"slug":80},{"id":134,"title":135,"slug":136},{"id":90,"title":91,"slug":92},{"slug":360,"title":361,"logo":362,"baseline":363,"categories":364},"flodesk","Flodesk","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fflodesk-57ced817.png","Design emails people love to open. Sell online.",[365,369],{"id":366,"title":367,"slug":368},27,"Email Newsletters","email-newsletters",{"id":55,"title":281,"slug":282},{"uuid":371,"title":372,"description":373,"canonical_path":374,"image":375,"width":39,"height":156,"image_alt":376,"published_at":377,"kind":43,"patterns":378,"component_categories":383,"app":388},"3f863716-2469-4a36-8f49-65c77d655176","Motion","Calendar view where the user manages their weekly schedule, tasks, and connected calendars across a three-pane layout.","\u002Fexamples\u002Fapps\u002Fmotion\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F3f863716-2469-4a36-8f49-65c77d655176.png","Motion from Motion","2025-02-10T16:08:17.000Z",[379,381],{"id":173,"label":174,"slug":175,"rank":49,"group":380},{"id":177,"label":178,"slug":179},{"id":168,"label":169,"slug":170,"rank":58,"group":382},{"id":99,"label":165,"slug":166},[384,385,386,387],{"id":82,"title":83,"slug":84},{"id":134,"title":135,"slug":136},{"id":86,"title":87,"slug":88},{"id":90,"title":91,"slug":92},{"slug":389,"title":372,"logo":390,"baseline":391,"categories":392},"motion","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fmotion-6fac92db.png","Use AI to plan your work, automatically",[393,394,398,399],{"id":147,"title":148,"slug":149},{"id":395,"title":396,"slug":397},29,"Task Management","task-management",{"id":189,"title":190,"slug":191},{"id":400,"title":174,"slug":175},101,{"uuid":402,"title":403,"description":404,"canonical_path":405,"image":406,"width":39,"height":156,"image_alt":407,"published_at":408,"kind":43,"patterns":409,"component_categories":424,"app":426},"8afd86d0-75d7-42f4-b4d8-483bb67ca414","Home | Secfi","Settings drawer where the user updates company valuation and employment information for tax estimation, showing a success confirmation.","\u002Fexamples\u002Fapps\u002Fsecfi\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F8afd86d0-75d7-42f4-b4d8-483bb67ca414.png","Home | Secfi from Secfi","2025-02-03T13:08:50.000Z",[410,412,420],{"id":210,"label":211,"slug":212,"rank":49,"group":411},{"id":214,"label":215,"slug":216},{"id":413,"label":414,"slug":415,"rank":58,"group":416},122,"Success","success",{"id":417,"label":418,"slug":419},12,"States & Feedback","states-and-feedback",{"id":299,"label":421,"slug":422,"rank":51,"group":423},"Edit","edit",{"id":51,"label":52,"slug":53},[425],{"id":90,"title":91,"slug":92},{"slug":427,"title":428,"logo":429,"baseline":430,"categories":431},"secfi","Secfi","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fsecfi-680f7b1f.png","The leading financial advisor for tech people",[432],{"id":237,"title":238,"slug":239},{"uuid":434,"title":435,"description":436,"canonical_path":437,"image":438,"width":39,"height":156,"image_alt":439,"published_at":440,"kind":43,"patterns":441,"component_categories":460,"app":463},"68b1b86d-bd1b-4a65-a020-54caf269f37e","20b","Product tour step demonstrating a mobile scheduling interface where users can pick a date from a calendar and confirm a time slot.","\u002Fexamples\u002Fapps\u002Fkajabi\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F68b1b86d-bd1b-4a65-a020-54caf269f37e.png","20b from Kajabi","2025-01-27T19:31:18.000Z",[442,444,449,454],{"id":173,"label":174,"slug":175,"rank":49,"group":443},{"id":177,"label":178,"slug":179},{"id":445,"label":446,"slug":447,"rank":58,"group":448},21,"Schedule","schedule",{"id":51,"label":52,"slug":53},{"id":450,"label":451,"slug":452,"rank":51,"group":453},114,"Confirmation","confirmation",{"id":417,"label":418,"slug":419},{"id":455,"label":456,"slug":457,"rank":458,"group":459},54,"Date & Time","date-and-time",3,{"id":177,"label":178,"slug":179},[461,462],{"id":134,"title":135,"slug":136},{"id":90,"title":91,"slug":92},{"slug":464,"title":465,"logo":466,"baseline":467,"categories":468},"kajabi","Kajabi","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fkajabi-a4858d70.png","Where Creators Build Businesses",[469,473,474,477,478],{"id":470,"title":471,"slug":472},32,"Education","education",{"id":55,"title":281,"slug":282},{"id":58,"title":475,"slug":476},"Communities","communities",{"id":366,"title":367,"slug":368},{"id":479,"title":480,"slug":481},33,"E-Learning","e-learning",{"uuid":483,"title":484,"description":485,"canonical_path":486,"image":487,"width":39,"height":488,"image_alt":489,"published_at":490,"kind":43,"patterns":491,"component_categories":501,"app":510},"e53752b6-60e1-4851-9f8c-a766d748de81","Setup audience · Jimo","Detail page where the user configures targeting, timing recurrence, and priority rules for a specific app tour experience.","\u002Fexamples\u002Fapps\u002Fjimo\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fe53752b6-60e1-4851-9f8c-a766d748de81.png",3680,"Setup audience · Jimo from Jimo","2025-01-13T14:25:22.000Z",[492,497,499],{"id":493,"label":494,"slug":495,"rank":49,"group":496},17,"Publish","publish",{"id":51,"label":52,"slug":53},{"id":299,"label":421,"slug":422,"rank":58,"group":498},{"id":51,"label":52,"slug":53},{"id":210,"label":211,"slug":212,"rank":51,"group":500},{"id":214,"label":215,"slug":216},[502,506,507,508,509],{"id":503,"title":504,"slug":505},257,"Input number","input-number",{"id":130,"title":131,"slug":132},{"id":82,"title":83,"slug":84},{"id":134,"title":135,"slug":136},{"id":90,"title":91,"slug":92},{"slug":511,"title":512,"logo":513,"baseline":514,"categories":515},"jimo","Jimo","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fjimo-bc34493a.png","Onboard users smarter, scale faster. ",[516,517,521],{"id":255,"title":325,"slug":326},{"id":518,"title":519,"slug":520},69,"Surveys","surveys",{"id":522,"title":523,"slug":524},96,"No code","no-code",{"uuid":526,"title":527,"description":528,"canonical_path":529,"image":530,"width":39,"height":156,"image_alt":531,"published_at":532,"kind":43,"patterns":533,"component_categories":547,"app":555},"b6dff68d-dc4d-4a85-92fe-15948a1ad51f","Jeremy Rees","Detail page where the user views a teammate's profile and uses a modal to pause notifications until a specific date and time.","\u002Fexamples\u002Fapps\u002Fcampsite\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fb6dff68d-dc4d-4a85-92fe-15948a1ad51f.png","Jeremy Rees from Campsite","2025-01-06T11:52:24.000Z",[534,538,540,545],{"id":458,"label":535,"slug":536,"rank":49,"group":537},"Profile","profile",{"id":299,"label":300,"slug":301},{"id":299,"label":421,"slug":422,"rank":58,"group":539},{"id":51,"label":52,"slug":53},{"id":541,"label":542,"slug":543,"rank":51,"group":544},99,"Notification Settings","notification-settings",{"id":214,"label":215,"slug":216},{"id":455,"label":456,"slug":457,"rank":458,"group":546},{"id":177,"label":178,"slug":179},[548,552,553,554],{"id":549,"title":550,"slug":551},177,"Breadcrumb","breadcrumb",{"id":74,"title":75,"slug":76},{"id":86,"title":87,"slug":88},{"id":90,"title":91,"slug":92},{"slug":556,"title":557,"logo":558,"baseline":559,"categories":560},"campsite","Campsite","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fcampsite-b08e9520.png","The home for your team’s work in progress",[561,562],{"id":99,"title":100,"slug":101},{"id":103,"title":104,"slug":105},[],[565,567,569,571,573,575,577,579,581,583,585,587,589,592,595,598,601,604,607,610,613,616,619,622],{"label":174,"to":566,"count":259},"\u002Fexamples\u002Fscreens\u002Fcalendar",{"label":421,"to":568,"count":458},"\u002Fexamples\u002Fscreens\u002Fedit",{"label":211,"to":570,"count":458},"\u002Fexamples\u002Fscreens\u002Fsettings",{"label":456,"to":572,"count":51},"\u002Fexamples\u002Fscreens\u002Fdate-and-time",{"label":169,"to":574,"count":51},"\u002Fexamples\u002Fscreens\u002Ftasks",{"label":47,"to":576,"count":58},"\u002Fexamples\u002Fscreens\u002Fadd-and-create",{"label":251,"to":578,"count":58},"\u002Fexamples\u002Fscreens\u002Fapproval-flow",{"label":343,"to":580,"count":58},"\u002Fexamples\u002Fscreens\u002Fcheckout",{"label":451,"to":582,"count":58},"\u002Fexamples\u002Fscreens\u002Fconfirmation",{"label":219,"to":584,"count":58},"\u002Fexamples\u002Fscreens\u002Fdelete",{"label":263,"to":586,"count":58},"\u002Fexamples\u002Fscreens\u002Ffilter-and-sort",{"label":162,"to":588,"count":58},"\u002Fexamples\u002Fscreens\u002Fhome",{"label":590,"to":591},"Workflow design examples","\u002Fexamples\u002Fapps\u002Fworkflow",{"label":593,"to":594},"Notion Mail design examples","\u002Fexamples\u002Fapps\u002Fnotion-mail",{"label":596,"to":597},"Reflect design examples","\u002Fexamples\u002Fapps\u002Freflect",{"label":599,"to":600},"Monarch design examples","\u002Fexamples\u002Fapps\u002Fmonarch",{"label":602,"to":603},"Assembly design examples","\u002Fexamples\u002Fapps\u002Fmeet-assembly",{"label":605,"to":606},"Front design examples","\u002Fexamples\u002Fapps\u002Ffront",{"label":608,"to":609},"Flodesk design examples","\u002Fexamples\u002Fapps\u002Fflodesk",{"label":611,"to":612},"Motion design examples","\u002Fexamples\u002Fapps\u002Fmotion",{"label":614,"to":615},"Secfi design examples","\u002Fexamples\u002Fapps\u002Fsecfi",{"label":617,"to":618},"Kajabi design examples","\u002Fexamples\u002Fapps\u002Fkajabi",{"label":620,"to":621},"Jimo design examples","\u002Fexamples\u002Fapps\u002Fjimo",{"label":623,"to":624},"Campsite design examples","\u002Fexamples\u002Fapps\u002Fcampsite",{"published_at":626,"updated_at":627},"2024-12-15T21:05:09.000Z","2026-09-05T20:19:53.383Z"]