[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Ftags\u002Fe-commerce":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":559,"links":560,"dates":621},"\u002Fexamples\u002Ftags\u002Fe-commerce","collection","screens",true,{"example_count":9,"app_count":10},6488,207,{"id":12,"title":13,"description":14},350,"E-commerce","",{"title":16,"description":17,"og_image":18},"E-commerce screen examples - Nicelydone","E-commerce screen design examples from SaaS apps. Browse examples from Dock, Whop, Loops.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F0486f664-fe49-4ee7-ae14-2a398e8a6c74.png",[20,23,26],{"label":21,"to":22},"Examples","\u002Fexamples",{"label":24,"to":25},"tags","\u002Fexamples\u002Ftags",{"label":27,"to":4},"E-commerce screen examples",{"title":27,"eyebrow":29,"description":17,"sections":30,"body":31},"Tag category",[],[32],"6488 screens",[34,100,153,192,253,298,329,371,415,459,487,524],{"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":69,"app":86},"0486f664-fe49-4ee7-ae14-2a398e8a6c74","Order form terms · Dock","Settings page where the user configures available options for billing start dates, payment methods, and contract lengths on order forms.","\u002Fexamples\u002Fapps\u002Fdock\u002Fscreens",3024,1758,"Order form terms · Dock from Dock","2026-07-13T15:30:47.000Z","screen",[45,54,60],{"id":46,"label":47,"slug":48,"rank":49,"group":50},102,"Settings","settings",0,{"id":51,"label":52,"slug":53},10,"Settings & Admin","settings-and-admin",{"id":55,"label":56,"slug":57,"rank":58,"group":59},96,"Billing Settings","billing-settings",1,{"id":51,"label":52,"slug":53},{"id":61,"label":62,"slug":63,"rank":64,"group":65},42,"Form","form",2,{"id":66,"label":67,"slug":68},4,"Data & Analysis","data-and-analysis",[70,74,78,82],{"id":71,"title":72,"slug":73},177,"Breadcrumb","breadcrumb",{"id":75,"title":76,"slug":77},168,"Accordion","accordion",{"id":79,"title":80,"slug":81},260,"Badge","badge",{"id":83,"title":84,"slug":85},175,"Button","button",{"slug":87,"title":88,"logo":89,"baseline":90,"categories":91},"dock","Dock","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fdock-k4tgvy1y.png","The new way to manage external relationships",[92,96],{"id":93,"title":94,"slug":95},23,"Collaboration","collaboration",{"id":97,"title":98,"slug":99},29,"Task Management","task-management",{"uuid":101,"title":102,"description":103,"canonical_path":104,"image":105,"width":39,"height":106,"image_alt":107,"published_at":108,"kind":43,"patterns":109,"component_categories":130,"app":136},"66a47772-a309-48d1-9b96-f5fbb5bb7a00","Dashboard | Whop","List view of digital products where a modal prompts the user to confirm the irreversible deletion of a selected product.","\u002Fexamples\u002Fapps\u002Fwhop\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F66a47772-a309-48d1-9b96-f5fbb5bb7a00.png",1780,"Dashboard | Whop from Whop","2026-02-16T13:59:46.000Z",[110,117,125],{"id":111,"label":112,"slug":113,"rank":49,"group":114},9,"Delete","delete",{"id":64,"label":115,"slug":116},"Actions","actions",{"id":118,"label":119,"slug":120,"rank":58,"group":121},114,"Confirmation","confirmation",{"id":122,"label":123,"slug":124},12,"States & Feedback","states-and-feedback",{"id":126,"label":127,"slug":128,"rank":64,"group":129},47,"Table","table",{"id":66,"label":67,"slug":68},[131,135],{"id":132,"title":133,"slug":134},211,"Pagination","pagination",{"id":79,"title":80,"slug":81},{"slug":137,"title":138,"logo":139,"baseline":140,"categories":141},"whop","Whop","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F07610bdc-865b-4784-b147-569a8e62691e.png","Where the internet does business",[142,145,149],{"id":58,"title":143,"slug":144},"Communities","communities",{"id":146,"title":147,"slug":148},18,"Marketplace","marketplace",{"id":150,"title":151,"slug":152},39,"Payments","payments",{"uuid":154,"title":155,"description":156,"canonical_path":157,"image":158,"width":39,"height":159,"image_alt":160,"published_at":161,"kind":43,"patterns":162,"component_categories":168,"app":174},"a64a4887-4078-4101-a841-3be0cf7a7e91","Settings | Stripe","Settings page where the user configures the Stripe integration by setting up webhooks, providing a signing secret, and subscribing to specific events.","\u002Fexamples\u002Fapps\u002Floops\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fa64a4887-4078-4101-a841-3be0cf7a7e91.png",2750,"Settings | Stripe from Loops","2025-10-27T15:44:02.000Z",[163],{"id":164,"label":165,"slug":166,"rank":49,"group":167},97,"Integrations","integrations",{"id":51,"label":52,"slug":53},[169,173],{"id":170,"title":171,"slug":172},174,"Card","card",{"id":83,"title":84,"slug":85},{"slug":175,"title":176,"logo":177,"baseline":178,"categories":179},"loops","Loops","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Floops-4f4bed58.png","The email platform for modern SaaS",[180,184,188],{"id":181,"title":182,"slug":183},92,"Email","email",{"id":185,"title":186,"slug":187},27,"Email Newsletters","email-newsletters",{"id":189,"title":190,"slug":191},25,"Marketing","marketing",{"uuid":193,"title":194,"description":195,"canonical_path":196,"image":197,"width":39,"height":106,"image_alt":198,"published_at":199,"kind":43,"patterns":200,"component_categories":221,"app":231},"3946377a-5516-4508-938a-88d7ae3384a7","Welcome - Circleback","Checkout page where the user enters their credit card details to start a trial, accompanied by a prominent customer testimonial.","\u002Fexamples\u002Fapps\u002Fcircleback\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F3946377a-5516-4508-938a-88d7ae3384a7.png","Welcome - Circleback from Circleback","2025-10-13T14:40:38.000Z",[201,209,214],{"id":202,"label":203,"slug":204,"rank":49,"group":205},130,"Checkout","checkout",{"id":206,"label":207,"slug":208},14,"Payments & Checkout","payments-and-checkout",{"id":210,"label":211,"slug":212,"rank":58,"group":213},131,"Payment Form","payment-form",{"id":206,"label":207,"slug":208},{"id":215,"label":216,"slug":217,"rank":64,"group":218},91,"Trial","trial",{"id":111,"label":219,"slug":220},"Plans & Limits","plans-and-limits",[222,226,230],{"id":223,"title":224,"slug":225},232,"Testimonial","testimonial",{"id":227,"title":228,"slug":229},169,"Avatar","avatar",{"id":83,"title":84,"slug":85},{"slug":232,"title":233,"logo":234,"baseline":235,"categories":236},"circleback","Circleback","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fcircleback-srajedn3.png","Unbelievably good meeting notes",[237,241,245,249],{"id":238,"title":239,"slug":240},30,"Productivity","productivity",{"id":242,"title":243,"slug":244},82,"Communication","communication",{"id":246,"title":247,"slug":248},22,"Knowledge Management","knowledge-management",{"id":250,"title":251,"slug":252},80,"Artificial Intelligence","artificial-intelligence",{"uuid":254,"title":255,"description":256,"canonical_path":257,"image":258,"width":39,"height":106,"image_alt":259,"published_at":260,"kind":43,"patterns":261,"component_categories":280,"app":284},"58cc60bb-c25c-4fca-bd5f-57bedd0d0813","Workflow","Project overview kanban board where the user tracks design tasks across different stages from to-do to done.","\u002Fexamples\u002Fapps\u002Fworkflow\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F58cc60bb-c25c-4fca-bd5f-57bedd0d0813.png","Workflow from Workflow","2025-09-30T08:25:02.000Z",[262,267,269,274],{"id":263,"label":264,"slug":265,"rank":49,"group":266},41,"Dashboard","dashboard",{"id":66,"label":67,"slug":68},{"id":126,"label":127,"slug":128,"rank":58,"group":268},{"id":66,"label":67,"slug":68},{"id":270,"label":271,"slug":272,"rank":64,"group":273},13,"Filter & Sort","filter-and-sort",{"id":64,"label":115,"slug":116},{"id":275,"label":276,"slug":277,"rank":278,"group":279},11,"Edit","edit",3,{"id":64,"label":115,"slug":116},[281,282,283],{"id":170,"title":171,"slug":172},{"id":79,"title":80,"slug":81},{"id":83,"title":84,"slug":85},{"slug":285,"title":255,"logo":286,"baseline":287,"categories":288},"workflow","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fworkflow-n6ecc4wx.png","Design feedback and revisions, all in one place",[289,293,294],{"id":290,"title":291,"slug":292},8,"Design","design",{"id":93,"title":94,"slug":95},{"id":295,"title":296,"slug":297},35,"Feedback","feedback",{"uuid":299,"title":300,"description":301,"canonical_path":302,"image":303,"width":39,"height":106,"image_alt":304,"published_at":305,"kind":43,"patterns":306,"component_categories":320,"app":322},"a9ba8c40-3633-4c5b-bbf0-bac4b5ce0b3a","Cobot","Landing page with a 3D cardboard box and a central button prompting the user to unbox.","\u002Fexamples\u002Fapps\u002Fcobot\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fa9ba8c40-3633-4c5b-bbf0-bac4b5ce0b3a.png","Cobot from Cobot","2025-09-15T14:01:17.000Z",[307,315],{"id":308,"label":309,"slug":310,"rank":49,"group":311},72,"Getting Started","getting-started",{"id":312,"label":313,"slug":314},7,"Onboarding & Education","onboarding-and-education",{"id":316,"label":317,"slug":318,"rank":58,"group":319},77,"Welcome","welcome",{"id":312,"label":313,"slug":314},[321],{"id":83,"title":84,"slug":85},{"slug":323,"title":300,"logo":324,"baseline":325,"categories":326},"cobot","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fcobot-cfgifddahsrq.png","The first to-do app that does it for you",[327,328],{"id":250,"title":251,"slug":252},{"id":238,"title":239,"slug":240},{"uuid":330,"title":291,"description":331,"canonical_path":332,"image":333,"width":39,"height":106,"image_alt":334,"published_at":335,"kind":43,"patterns":336,"component_categories":351,"app":355},"52115a7e-0149-41cb-b573-87e543fcf268","Design editor where the user customizes the appearance of a signup form by adjusting colors, button styles, and custom CSS alongside a live preview.","\u002Fexamples\u002Fapps\u002Foutseta\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F52115a7e-0149-41cb-b573-87e543fcf268.png","Design from Outseta","2025-09-01T19:09:29.000Z",[337,345,347,349],{"id":338,"label":339,"slug":340,"rank":49,"group":341},55,"Design Editor","design-editor",{"id":342,"label":343,"slug":344},5,"Media & Tools","media-and-tools",{"id":275,"label":276,"slug":277,"rank":58,"group":346},{"id":64,"label":115,"slug":116},{"id":61,"label":62,"slug":63,"rank":64,"group":348},{"id":66,"label":67,"slug":68},{"id":46,"label":47,"slug":48,"rank":278,"group":350},{"id":51,"label":52,"slug":53},[352,353,354],{"id":75,"title":76,"slug":77},{"id":170,"title":171,"slug":172},{"id":83,"title":84,"slug":85},{"slug":356,"title":357,"logo":358,"baseline":359,"categories":360},"outseta","Outseta","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F936c2a3c-b3fd-40ad-a0f0-efcb89fadd6c.png","The membership operating system",[361,362,363,367,368],{"id":58,"title":143,"slug":144},{"id":181,"title":182,"slug":183},{"id":364,"title":365,"slug":366},53,"CRM","crm",{"id":150,"title":151,"slug":152},{"id":126,"title":369,"slug":370},"Customer Service","customer-service",{"uuid":372,"title":373,"description":374,"canonical_path":375,"image":376,"width":39,"height":106,"image_alt":377,"published_at":378,"kind":43,"patterns":379,"component_categories":392,"app":400},"6e3d556e-0c71-4f7b-ba44-0c9489db3abb","Settings | Nicelydone Club","Settings modal where the admin can browse available integrations in a sidebar and is prompted to connect their Stripe account.","\u002Fexamples\u002Fapps\u002Fmighty\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F6e3d556e-0c71-4f7b-ba44-0c9489db3abb.png","Settings | Nicelydone Club from Mighty","2025-09-01T19:09:04.000Z",[380,382,387],{"id":164,"label":165,"slug":166,"rank":49,"group":381},{"id":51,"label":52,"slug":53},{"id":383,"label":384,"slug":385,"rank":58,"group":386},104,"Team Management","team-management",{"id":51,"label":52,"slug":53},{"id":388,"label":389,"slug":390,"rank":64,"group":391},132,"Payment Method","payment-method",{"id":206,"label":207,"slug":208},[393,397,398,399],{"id":394,"title":395,"slug":396},284,"Modal","modal",{"id":227,"title":228,"slug":229},{"id":75,"title":76,"slug":77},{"id":83,"title":84,"slug":85},{"slug":401,"title":402,"logo":403,"baseline":404,"categories":405},"mighty","Mighty","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fc0279d6a-b2eb-48fc-9c70-cb63d6da76f3.png","Community platform, courses & memberships",[406,410,411],{"id":407,"title":408,"slug":409},33,"E-Learning","e-learning",{"id":58,"title":143,"slug":144},{"id":412,"title":413,"slug":414},26,"Events","events",{"uuid":416,"title":417,"description":418,"canonical_path":419,"image":420,"width":39,"height":421,"image_alt":422,"published_at":423,"kind":43,"patterns":424,"component_categories":439,"app":449},"7b7c2f1a-2fd1-4e7c-a4d8-90ad7c1b47d2","Howard Migdal - CEO at Grubhub | The Org","Detail page where the user views a CEO's organizational chart, leadership team, and related company context.","\u002Fexamples\u002Fapps\u002Fthe-org\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F7b7c2f1a-2fd1-4e7c-a4d8-90ad7c1b47d2.png",4422,"Howard Migdal - CEO at Grubhub | The Org from The org","2025-07-14T09:42:36.000Z",[425,431],{"id":278,"label":426,"slug":427,"rank":49,"group":428},"Profile","profile",{"id":275,"label":429,"slug":430},"Social & Collaboration","social-and-collaboration",{"id":432,"label":433,"slug":434,"rank":58,"group":435},62,"Breadcrumbs","breadcrumbs",{"id":436,"label":437,"slug":438},6,"Navigation & Commands","navigation-and-commands",[440,444,445,446,447,448],{"id":441,"title":442,"slug":443},240,"Horizontal navigation","horizontal-navigation",{"id":71,"title":72,"slug":73},{"id":227,"title":228,"slug":229},{"id":170,"title":171,"slug":172},{"id":79,"title":80,"slug":81},{"id":83,"title":84,"slug":85},{"slug":450,"title":451,"logo":452,"baseline":453,"categories":454},"the-org","The org","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fthe-org-d95f10a7.png","Where great teams live",[455],{"id":456,"title":457,"slug":458},49,"Social Network","social-network",{"uuid":460,"title":56,"description":461,"canonical_path":462,"image":463,"width":39,"height":106,"image_alt":464,"published_at":465,"kind":43,"patterns":466,"component_categories":471,"app":475},"6b889ce8-b91e-4e8c-b23f-167d0f3edb1d","Settings modal where the user enters their credit card details or selects a bank account to save payment information.","\u002Fexamples\u002Fapps\u002Flindy\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F6b889ce8-b91e-4e8c-b23f-167d0f3edb1d.png","Billing Settings from Lindy","2025-07-14T07:38:40.000Z",[467,469],{"id":210,"label":211,"slug":212,"rank":49,"group":468},{"id":206,"label":207,"slug":208},{"id":55,"label":56,"slug":57,"rank":58,"group":470},{"id":51,"label":52,"slug":53},[472,473,474],{"id":394,"title":395,"slug":396},{"id":79,"title":80,"slug":81},{"id":83,"title":84,"slug":85},{"slug":476,"title":477,"logo":478,"baseline":479,"categories":480},"lindy","Lindy","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Flindy-k2eius5s.png","Meet your AI assistant",[481,482,483],{"id":250,"title":251,"slug":252},{"id":238,"title":239,"slug":240},{"id":484,"title":485,"slug":486},105,"Workflow Automation","workflow-automation",{"uuid":488,"title":489,"description":490,"canonical_path":491,"image":492,"width":39,"height":106,"image_alt":493,"published_at":494,"kind":43,"patterns":495,"component_categories":502,"app":508},"8a86ae98-1023-4e5b-8589-861cc0d8cc2d","Set a new password | Fourthwall","Authentication screen where the user sets a new password and can choose to log out of other devices.","\u002Fexamples\u002Fapps\u002Ffourthwall\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F8a86ae98-1023-4e5b-8589-861cc0d8cc2d.png","Set a new password | Fourthwall from Fourthwall","2025-07-07T13:03:35.000Z",[496],{"id":64,"label":497,"slug":498,"rank":49,"group":499},"Forgot Password","forgot-password",{"id":58,"label":500,"slug":501},"Access & Account","access-and-account",[503,507],{"id":504,"title":505,"slug":506},167,"Alert","alert",{"id":83,"title":84,"slug":85},{"slug":509,"title":510,"logo":511,"baseline":512,"categories":513},"fourthwall","Fourthwall","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F6cf581b1-c7fa-41be-a627-bf2934115d62.png","Launch your brand. On your terms",[514,517,521],{"id":278,"title":515,"slug":516},"Shopping","shopping",{"id":518,"title":519,"slug":520},58,"Social Commerce","social-commerce",{"id":312,"title":522,"slug":523},"Web Development","web-development",{"uuid":525,"title":526,"description":527,"canonical_path":528,"image":529,"width":39,"height":106,"image_alt":530,"published_at":531,"kind":43,"patterns":532,"component_categories":543,"app":551},"1eb2af29-6aee-4be4-801d-f06e3d7d5f61","Freckle","Data table view where the user manages company records, configures visible columns, and sets up export integrations.","\u002Fexamples\u002Fapps\u002Ffreckle\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F1eb2af29-6aee-4be4-801d-f06e3d7d5f61.png","Freckle from Freckle","2025-06-30T13:53:29.000Z",[533,535,537,541],{"id":126,"label":127,"slug":128,"rank":49,"group":534},{"id":66,"label":67,"slug":68},{"id":270,"label":271,"slug":272,"rank":58,"group":536},{"id":64,"label":115,"slug":116},{"id":189,"label":538,"slug":539,"rank":64,"group":540},"Upload & Download","upload-and-download",{"id":64,"label":115,"slug":116},{"id":275,"label":276,"slug":277,"rank":278,"group":542},{"id":64,"label":115,"slug":116},[544,548,549,550],{"id":545,"title":546,"slug":547},233,"Tabs","tabs",{"id":441,"title":442,"slug":443},{"id":75,"title":76,"slug":77},{"id":83,"title":84,"slug":85},{"slug":552,"title":526,"logo":553,"baseline":554,"categories":555},"freckle","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Ffreckle-93eaytji.png","The Clay-alternative built for non-technical users",[556,557,558],{"id":364,"title":365,"slug":366},{"id":250,"title":251,"slug":252},{"id":189,"title":190,"slug":191},[],[561,563,565,567,569,571,573,575,577,579,581,583,585,588,591,594,597,600,603,606,609,612,615,618],{"label":276,"to":562,"count":278},"\u002Fexamples\u002Fscreens\u002Fedit",{"label":127,"to":564,"count":278},"\u002Fexamples\u002Fscreens\u002Ftable",{"label":56,"to":566,"count":64},"\u002Fexamples\u002Fscreens\u002Fbilling-settings",{"label":271,"to":568,"count":64},"\u002Fexamples\u002Fscreens\u002Ffilter-and-sort",{"label":62,"to":570,"count":64},"\u002Fexamples\u002Fscreens\u002Fform",{"label":165,"to":572,"count":64},"\u002Fexamples\u002Fscreens\u002Fintegrations",{"label":211,"to":574,"count":64},"\u002Fexamples\u002Fscreens\u002Fpayment-form",{"label":47,"to":576,"count":64},"\u002Fexamples\u002Fscreens\u002Fsettings",{"label":433,"to":578,"count":58},"\u002Fexamples\u002Fscreens\u002Fbreadcrumbs",{"label":203,"to":580,"count":58},"\u002Fexamples\u002Fscreens\u002Fcheckout",{"label":119,"to":582,"count":58},"\u002Fexamples\u002Fscreens\u002Fconfirmation",{"label":264,"to":584,"count":58},"\u002Fexamples\u002Fscreens\u002Fdashboard",{"label":586,"to":587},"Dock design examples","\u002Fexamples\u002Fapps\u002Fdock",{"label":589,"to":590},"Whop design examples","\u002Fexamples\u002Fapps\u002Fwhop",{"label":592,"to":593},"Loops design examples","\u002Fexamples\u002Fapps\u002Floops",{"label":595,"to":596},"Circleback design examples","\u002Fexamples\u002Fapps\u002Fcircleback",{"label":598,"to":599},"Workflow design examples","\u002Fexamples\u002Fapps\u002Fworkflow",{"label":601,"to":602},"Cobot design examples","\u002Fexamples\u002Fapps\u002Fcobot",{"label":604,"to":605},"Outseta design examples","\u002Fexamples\u002Fapps\u002Foutseta",{"label":607,"to":608},"Mighty design examples","\u002Fexamples\u002Fapps\u002Fmighty",{"label":610,"to":611},"The org design examples","\u002Fexamples\u002Fapps\u002Fthe-org",{"label":613,"to":614},"Lindy design examples","\u002Fexamples\u002Fapps\u002Flindy",{"label":616,"to":617},"Fourthwall design examples","\u002Fexamples\u002Fapps\u002Ffourthwall",{"label":619,"to":620},"Freckle design examples","\u002Fexamples\u002Fapps\u002Ffreckle",{"published_at":622,"updated_at":623},"2024-12-11T09:56:56.000Z","2026-09-26T16:00:06.446Z"]