[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fpages\u002Fdropdown-other-states":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":37,"showcases":558,"links":559,"dates":596},"\u002Fexamples\u002Fpages\u002Fdropdown-other-states","collection","pages",true,{"example_count":9,"app_count":10},5698,496,{"id":12,"title":13,"description":14},10,"Dropdown & other states","Explore Dropdown page design in SaaS. These menus, sometimes called \"select\" or \"options\" menus, enhance user experience by organizing choices. Browse examples of Dropdown pages design from the best SaaS apps and see how they simplify navigation and improve user interface.",{"title":16,"description":17,"og_image":18},"Dropdown & other states page examples - Nicelydone","Dropdown & other states page design examples from SaaS websites. Explore Dropdown page design in SaaS. These menus, sometimes called \"select\" or \"options\"…","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F988cb9c9-c067-4f47-b59a-f9002c8135ce.png",[20,23,26],{"label":21,"to":22},"Examples","\u002Fexamples",{"label":24,"to":25},"SaaS marketing page examples","\u002Fexamples\u002Fpages",{"label":27,"to":4},"Dropdown & other states page examples",{"title":27,"eyebrow":29,"description":30,"sections":31,"body":35},"UI category","Dropdown & other states page design examples from SaaS websites. Explore Dropdown page design in SaaS. These menus, sometimes called \"select\" or \"options\" menus, enhance user experience by organizing choices. Browse…",[32],{"title":33,"description":14,"links":34},"About Dropdown & other states",[],[36],"5698 marketing pages",[38,92,132,187,243,275,317,358,382,426,466,509],{"uuid":39,"title":40,"description":41,"canonical_path":42,"image":18,"width":43,"height":44,"image_alt":45,"published_at":46,"kind":47,"patterns":48,"component_categories":70,"app":79},"988cb9c9-c067-4f47-b59a-f9002c8135ce","Spaces · Dock","AI chat drawer where the user interacts with a workspace agent to rewrite documents and plan deal room content.","\u002Fexamples\u002Fapps\u002Fdock\u002Fscreens",3024,1758,"Spaces · Dock from Dock","2026-07-13T15:30:47.000Z","screen",[49,58,64],{"id":50,"label":51,"slug":52,"rank":53,"group":54},28,"AI Chat","ai-chat",0,{"id":55,"label":56,"slug":57},3,"AI","ai",{"id":59,"label":60,"slug":61,"rank":62,"group":63},27,"AI Assistant","ai-assistant",1,{"id":55,"label":56,"slug":57},{"id":65,"label":66,"slug":67,"rank":68,"group":69},29,"AI Editing","ai-editing",2,{"id":55,"label":56,"slug":57},[71,75],{"id":72,"title":73,"slug":74},174,"Card","card",{"id":76,"title":77,"slug":78},175,"Button","button",{"slug":80,"title":81,"logo":82,"baseline":83,"categories":84},"dock","Dock","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fdock-k4tgvy1y.png","The new way to manage external relationships",[85,89],{"id":86,"title":87,"slug":88},23,"Collaboration","collaboration",{"id":65,"title":90,"slug":91},"Task Management","task-management",{"uuid":93,"title":94,"description":95,"canonical_path":96,"image":97,"width":43,"height":44,"image_alt":98,"published_at":99,"kind":47,"patterns":100,"component_categories":108,"app":110},"40a4be40-ae04-44f3-9191-e81c085fb3e6","Sign In - Beside","Sign-in screen where the user authenticates with Google, Apple, email, or phone.","\u002Fexamples\u002Fapps\u002Fbeside\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F40a4be40-ae04-44f3-9191-e81c085fb3e6.png","Sign In - Beside from Beside","2026-06-29T18:30:01.000Z",[101],{"id":102,"label":103,"slug":104,"rank":53,"group":105},4,"Sign In","sign-in",{"id":62,"label":106,"slug":107},"Access & Account","access-and-account",[109],{"id":76,"title":77,"slug":78},{"slug":111,"title":112,"logo":113,"baseline":114,"categories":115},"beside","Beside","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F8c14025e-58b4-4801-bd91-3e31a3cf8f21.png","AI-powered business phone assistant that answers calls and takes action",[116,120,124,128],{"id":117,"title":118,"slug":119},80,"Artificial Intelligence","artificial-intelligence",{"id":121,"title":122,"slug":123},47,"Customer Service","customer-service",{"id":125,"title":126,"slug":127},53,"CRM","crm",{"id":129,"title":130,"slug":131},82,"Communication","communication",{"uuid":133,"title":134,"description":135,"canonical_path":136,"image":137,"width":43,"height":44,"image_alt":138,"published_at":139,"kind":47,"patterns":140,"component_categories":161,"app":172},"a86570fe-6be4-40a4-9fe6-dd00108d8655","Exa Websets | People Search & B2B Lead Generation","Billing settings page where the user monitors their free plan credit balance and compares paid subscription tiers to upgrade.","\u002Fexamples\u002Fapps\u002Fexa\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fa86570fe-6be4-40a4-9fe6-dd00108d8655.png","Exa Websets | People Search & B2B Lead Generation from Exa","2026-06-23T14:19:28.000Z",[141,149,154],{"id":142,"label":143,"slug":144,"rank":53,"group":145},89,"Pricing","pricing",{"id":146,"label":147,"slug":148},9,"Plans & Limits","plans-and-limits",{"id":150,"label":151,"slug":152,"rank":62,"group":153},93,"Usage Limit","usage-limit",{"id":146,"label":147,"slug":148},{"id":155,"label":156,"slug":157,"rank":68,"group":158},96,"Billing Settings","billing-settings",{"id":12,"label":159,"slug":160},"Settings & Admin","settings-and-admin",[162,166,170,171],{"id":163,"title":164,"slug":165},169,"Avatar","avatar",{"id":167,"title":168,"slug":169},260,"Badge","badge",{"id":72,"title":73,"slug":74},{"id":76,"title":77,"slug":78},{"slug":173,"title":174,"logo":175,"baseline":176,"categories":177},"exa","Exa","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F011e446a-087b-451e-b27d-63d67d92a42f.png","Real-time AI search engine with structured web search API and deep research tools",[178,182,183],{"id":179,"title":180,"slug":181},55,"Search engine","search-engine",{"id":117,"title":118,"slug":119},{"id":184,"title":185,"slug":186},37,"Developer APIs","developer-apis",{"uuid":188,"title":189,"description":190,"canonical_path":191,"image":192,"width":43,"height":44,"image_alt":193,"published_at":194,"kind":47,"patterns":195,"component_categories":217,"app":225},"62b79a5e-ad5e-48ab-85e2-05b88a0c3ad0","Approvals","Inbox view where the user manages team invitations and routine approvals, currently showing a zero-state message with no pending items.","\u002Fexamples\u002Fapps\u002Ftown\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F62b79a5e-ad5e-48ab-85e2-05b88a0c3ad0.png","Approvals from Town","2026-06-16T15:01:01.000Z",[196,204,212],{"id":197,"label":198,"slug":199,"rank":53,"group":200},115,"Empty State","empty-state",{"id":201,"label":202,"slug":203},12,"States & Feedback","states-and-feedback",{"id":205,"label":206,"slug":207,"rank":62,"group":208},123,"Approval Flow","approval-flow",{"id":209,"label":210,"slug":211},13,"Workflow & Automation","workflow-and-automation",{"id":213,"label":214,"slug":215,"rank":68,"group":216},92,"Upgrade Prompt","upgrade-prompt",{"id":146,"label":147,"slug":148},[218,222,223,224],{"id":219,"title":220,"slug":221},214,"Popover","popover",{"id":163,"title":164,"slug":165},{"id":167,"title":168,"slug":169},{"id":76,"title":77,"slug":78},{"slug":226,"title":227,"logo":228,"baseline":229,"categories":230},"town","Town","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fb6cf707d-df49-4190-b803-766b8914df89.png","The AI assistant that manages your inbox, schedules meetings, and handles busywork.",[231,232,236,239],{"id":117,"title":118,"slug":119},{"id":233,"title":234,"slug":235},30,"Productivity","productivity",{"id":213,"title":237,"slug":238},"Email","email",{"id":240,"title":241,"slug":242},101,"Calendar","calendar",{"uuid":244,"title":245,"description":246,"canonical_path":247,"image":248,"width":43,"height":44,"image_alt":249,"published_at":250,"kind":47,"patterns":251,"component_categories":261,"app":263},"53fb8730-2f3c-46c0-88a4-5f017305b914","FLORA","Loading screen where the system provisions the user's new account before redirecting them to the app.","\u002Fexamples\u002Fapps\u002Fflora\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F53fb8730-2f3c-46c0-88a4-5f017305b914.png","FLORA from Flora","2026-05-26T09:34:20.000Z",[252,257],{"id":253,"label":254,"slug":255,"rank":53,"group":256},120,"Loading","loading",{"id":201,"label":202,"slug":203},{"id":62,"label":258,"slug":259,"rank":62,"group":260},"Account Setup","account-setup",{"id":62,"label":106,"slug":107},[262],{"id":72,"title":73,"slug":74},{"slug":264,"title":265,"logo":266,"baseline":267,"categories":268},"flora","Flora","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F5c3c6f99-7e88-4853-9e21-6fd175f2aa62.png","Your creative environement",[269,270,274],{"id":117,"title":118,"slug":119},{"id":271,"title":272,"slug":273},8,"Design","design",{"id":86,"title":87,"slug":88},{"uuid":276,"title":277,"description":278,"canonical_path":279,"image":280,"width":43,"height":44,"image_alt":281,"published_at":282,"kind":47,"patterns":283,"component_categories":301,"app":302},"d0642601-5eca-431f-aa93-d16ebeef4706","Assembly Dashboard – Nicelydone Club","Settings page where the user configures their portal's brand name and image assets while viewing a live preview.","\u002Fexamples\u002Fapps\u002Fassembly-2\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fd0642601-5eca-431f-aa93-d16ebeef4706.png","Assembly Dashboard – Nicelydone Club from Assembly AI App Builder","2026-05-25T20:17:51.000Z",[284,289,296],{"id":285,"label":286,"slug":287,"rank":53,"group":288},94,"Account Settings","account-settings",{"id":12,"label":159,"slug":160},{"id":290,"label":291,"slug":292,"rank":62,"group":293},25,"Upload & Download","upload-and-download",{"id":68,"label":294,"slug":295},"Actions","actions",{"id":297,"label":298,"slug":299,"rank":68,"group":300},91,"Trial","trial",{"id":146,"label":147,"slug":148},[],{"slug":303,"title":304,"logo":305,"baseline":306,"categories":307},"assembly-2","Assembly AI App Builder","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fe0ead769-d687-403b-a7bd-124ca7356944.png","AI-powered platform for professional services firms to build client portals and CRM tools",[308,309,313,314],{"id":125,"title":126,"slug":127},{"id":310,"title":311,"slug":312},90,"Business","business",{"id":117,"title":118,"slug":119},{"id":155,"title":315,"slug":316},"No code","no-code",{"uuid":318,"title":319,"description":320,"canonical_path":321,"image":322,"width":43,"height":44,"image_alt":323,"published_at":324,"kind":47,"patterns":325,"component_categories":340,"app":347},"137a9d22-ec04-4d55-9844-547ec3ae41ca","Lovable","Settings page where the user confirms permanent account deletion and provides a reason for leaving via a radio button survey.","\u002Fexamples\u002Fapps\u002Flovable\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F137a9d22-ec04-4d55-9844-547ec3ae41ca.png","Lovable from Lovable","2026-05-18T10:58:24.000Z",[326,331,335],{"id":327,"label":328,"slug":329,"rank":53,"group":330},114,"Confirmation","confirmation",{"id":201,"label":202,"slug":203},{"id":146,"label":332,"slug":333,"rank":62,"group":334},"Delete","delete",{"id":68,"label":294,"slug":295},{"id":336,"label":337,"slug":338,"rank":68,"group":339},117,"Feedback","feedback",{"id":201,"label":202,"slug":203},[341,345,346],{"id":342,"title":343,"slug":344},167,"Alert","alert",{"id":72,"title":73,"slug":74},{"id":76,"title":77,"slug":78},{"slug":348,"title":319,"logo":349,"baseline":350,"categories":351},"lovable","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F371498a3-d8de-4908-8af8-e73a603ffa34.png","Create apps and websites by chatting with AI",[352,353,357],{"id":117,"title":118,"slug":119},{"id":354,"title":355,"slug":356},7,"Web Development","web-development",{"id":155,"title":315,"slug":316},{"uuid":359,"title":360,"description":361,"canonical_path":362,"image":363,"width":43,"height":44,"image_alt":364,"published_at":365,"kind":47,"patterns":366,"component_categories":369,"app":372},"daa43952-0d7c-4870-bc53-4fa2b7d08a20","Login | Amie","Sign-in screen where the user authenticates with Google, set against a decorative background of floating calendar and task cards.","\u002Fexamples\u002Fapps\u002Famie\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fdaa43952-0d7c-4870-bc53-4fa2b7d08a20.png","Login | Amie from Amie","2026-05-18T09:02:08.000Z",[367],{"id":102,"label":103,"slug":104,"rank":53,"group":368},{"id":62,"label":106,"slug":107},[370,371],{"id":72,"title":73,"slug":74},{"id":76,"title":77,"slug":78},{"slug":373,"title":374,"logo":375,"baseline":376,"categories":377},"amie","Amie","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Famie-929f0269.png","The joyful productivity app",[378,379,380,381],{"id":240,"title":241,"slug":242},{"id":65,"title":90,"slug":91},{"id":233,"title":234,"slug":235},{"id":117,"title":118,"slug":119},{"uuid":383,"title":384,"description":385,"canonical_path":386,"image":387,"width":43,"height":388,"image_alt":389,"published_at":390,"kind":47,"patterns":391,"component_categories":410,"app":418},"ed00786a-2283-4aec-af2f-ffeb6bffc903","Agents | ElevenLabs","Create page where the user browses voice AI agent templates by category and previews their conversational workflow before starting.","\u002Fexamples\u002Fapps\u002Felevenlabs\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fed00786a-2283-4aec-af2f-ffeb6bffc903.png",1714,"Agents | ElevenLabs from Elevenlabs","2026-05-11T13:29:11.000Z",[392,397,404,408],{"id":393,"label":394,"slug":395,"rank":53,"group":396},26,"AI Agent","ai-agent",{"id":55,"label":56,"slug":57},{"id":398,"label":399,"slug":400,"rank":62,"group":401},79,"Browse","browse",{"id":271,"label":402,"slug":403},"Pages & Content","pages-and-content",{"id":209,"label":405,"slug":406,"rank":68,"group":407},"Filter & Sort","filter-and-sort",{"id":68,"label":294,"slug":295},{"id":50,"label":51,"slug":52,"rank":55,"group":409},{"id":55,"label":56,"slug":57},[411,415,416,417],{"id":412,"title":413,"slug":414},233,"Tabs","tabs",{"id":72,"title":73,"slug":74},{"id":167,"title":168,"slug":169},{"id":76,"title":77,"slug":78},{"slug":419,"title":420,"logo":421,"baseline":422,"categories":423},"elevenlabs","Elevenlabs","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F040a4c11-6cc6-49d0-85e4-c7f5a0265a3a.png","Bringing technology to life",[424,425],{"id":117,"title":118,"slug":119},{"id":184,"title":185,"slug":186},{"uuid":427,"title":428,"description":429,"canonical_path":430,"image":431,"width":43,"height":44,"image_alt":432,"published_at":433,"kind":47,"patterns":434,"component_categories":455,"app":459},"1817150f-6baa-4413-83aa-853d0facf08b","Shimmer","Agent trace interface where the user monitors an AI completing file creation and shell tasks, alongside a code editor showing the modified go.mod file and a live terminal.","\u002Fexamples\u002Fapps\u002Fpoolside\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F1817150f-6baa-4413-83aa-853d0facf08b.png","Shimmer from Poolside","2026-05-11T09:49:06.000Z",[435,437,444,451,453],{"id":393,"label":394,"slug":395,"rank":53,"group":436},{"id":55,"label":56,"slug":57},{"id":125,"label":438,"slug":439,"rank":62,"group":440},"Code Editor","code-editor",{"id":441,"label":442,"slug":443},5,"Media & Tools","media-and-tools",{"id":445,"label":446,"slug":447,"rank":68,"group":448},38,"Activity Log","activity-log",{"id":102,"label":449,"slug":450},"Data & Analysis","data-and-analysis",{"id":65,"label":66,"slug":67,"rank":55,"group":452},{"id":55,"label":56,"slug":57},{"id":50,"label":51,"slug":52,"rank":102,"group":454},{"id":55,"label":56,"slug":57},[456,457,458],{"id":412,"title":413,"slug":414},{"id":167,"title":168,"slug":169},{"id":76,"title":77,"slug":78},{"slug":460,"title":461,"logo":462,"baseline":463,"categories":464},"poolside","Poolside","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fde1e48e8-a8ea-49fc-a7ae-809596fc1bd8.png","Iterate on web apps, APIs, and CLIs from scratch, in a single workspace",[465],{"id":117,"title":118,"slug":119},{"uuid":467,"title":468,"description":469,"canonical_path":470,"image":471,"width":43,"height":44,"image_alt":472,"published_at":473,"kind":47,"patterns":474,"component_categories":483,"app":494},"f46fdef2-e56e-4c56-995e-9a5e05a3ba2e","Product Demos · nicelydone3","List view where the user manages product demos, currently showing a skeleton loading state for the data table alongside search and filter controls.","\u002Fexamples\u002Fapps\u002Fnavattic\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ff46fdef2-e56e-4c56-995e-9a5e05a3ba2e.png","Product Demos · nicelydone3 from Navattic","2026-05-05T10:32:31.000Z",[475,477,479],{"id":398,"label":399,"slug":400,"rank":53,"group":476},{"id":271,"label":402,"slug":403},{"id":209,"label":405,"slug":406,"rank":62,"group":478},{"id":68,"label":294,"slug":295},{"id":354,"label":480,"slug":481,"rank":68,"group":482},"Add & Create","add-and-create",{"id":68,"label":294,"slug":295},[484,488,492,493],{"id":485,"title":486,"slug":487},226,"Skeleton","skeleton",{"id":489,"title":490,"slug":491},177,"Breadcrumb","breadcrumb",{"id":167,"title":168,"slug":169},{"id":76,"title":77,"slug":78},{"slug":495,"title":496,"logo":497,"baseline":498,"categories":499},"navattic","Navattic","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fd26bd2f9-ee1e-4acc-9d41-1890fbd1b5c4.png","Make buying easier with demos",[500,503,504,505],{"id":290,"title":501,"slug":502},"Marketing","marketing",{"id":117,"title":118,"slug":119},{"id":155,"title":315,"slug":316},{"id":506,"title":507,"slug":508},103,"Demo Automation","demo-automation",{"uuid":510,"title":511,"description":512,"canonical_path":513,"image":514,"width":515,"height":516,"image_alt":517,"published_at":518,"kind":47,"patterns":519,"component_categories":532,"app":544},"55038189-e47d-4568-8eb6-3c6779ba8a16","Webhooks | Mailchimp","Settings page where the user manages webhooks to keep their audience synced with a local list, showing a successfully created webhook and a trial countdown banner.","\u002Fexamples\u002Fapps\u002Fmailchimp\u002Fscreens","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F55038189-e47d-4568-8eb6-3c6779ba8a16.png",2880,1670,"Webhooks | Mailchimp from Mailchimp","2026-04-29T12:25:29.000Z",[520,525,530],{"id":521,"label":522,"slug":523,"rank":53,"group":524},105,"Webhooks","webhooks",{"id":12,"label":159,"slug":160},{"id":526,"label":527,"slug":528,"rank":62,"group":529},122,"Success","success",{"id":201,"label":202,"slug":203},{"id":297,"label":298,"slug":299,"rank":68,"group":531},{"id":146,"label":147,"slug":148},[533,537,541,542,543],{"id":534,"title":535,"slug":536},240,"Horizontal navigation","horizontal-navigation",{"id":538,"title":539,"slug":540},277,"Button group","button-group",{"id":489,"title":490,"slug":491},{"id":163,"title":164,"slug":165},{"id":167,"title":168,"slug":169},{"slug":545,"title":546,"logo":547,"baseline":548,"categories":549},"mailchimp","Mailchimp","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fmailchimp-bd8e0c89.png","All-in-one marketing platform for small business",[550,551,554],{"id":290,"title":501,"slug":502},{"id":59,"title":552,"slug":553},"Email Newsletters","email-newsletters",{"id":555,"title":556,"slug":557},68,"SMS","sms",[],[560,563,566,569,572,575,578,581,584,587,590,593],{"label":561,"to":562},"Dock design examples","\u002Fexamples\u002Fapps\u002Fdock",{"label":564,"to":565},"Beside design examples","\u002Fexamples\u002Fapps\u002Fbeside",{"label":567,"to":568},"Exa design examples","\u002Fexamples\u002Fapps\u002Fexa",{"label":570,"to":571},"Town design examples","\u002Fexamples\u002Fapps\u002Ftown",{"label":573,"to":574},"Flora design examples","\u002Fexamples\u002Fapps\u002Fflora",{"label":576,"to":577},"Assembly AI App Builder design examples","\u002Fexamples\u002Fapps\u002Fassembly-2",{"label":579,"to":580},"Lovable design examples","\u002Fexamples\u002Fapps\u002Flovable",{"label":582,"to":583},"Amie design examples","\u002Fexamples\u002Fapps\u002Famie",{"label":585,"to":586},"Elevenlabs design examples","\u002Fexamples\u002Fapps\u002Felevenlabs",{"label":588,"to":589},"Poolside design examples","\u002Fexamples\u002Fapps\u002Fpoolside",{"label":591,"to":592},"Navattic design examples","\u002Fexamples\u002Fapps\u002Fnavattic",{"label":594,"to":595},"Mailchimp design examples","\u002Fexamples\u002Fapps\u002Fmailchimp",{"published_at":597,"updated_at":598},"2026-04-29T05:53:58.000Z","2026-09-27T00:00:01.803Z"]