[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fmapbox":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":21,"app":37,"examples":52,"showcases":53,"links":312,"dates":346},"\u002Fexamples\u002Fapps\u002Fmapbox","detail","apps",true,{"title":9,"description":10,"og_image":11},"Mapbox design examples - Nicelydone","Explore Mapbox UI design examples. Mapping platform for developers","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fdaeffb5f-71f9-4e56-90fe-83fc11623c3e.png",[13,16,19],{"label":14,"to":15},"Examples","\u002Fexamples",{"label":17,"to":18},"SaaS app design examples","\u002Fexamples\u002Fapps",{"label":20,"to":4},"Mapbox design examples",{"title":20,"eyebrow":22,"description":10,"sections":23,"body":36},"SaaS app examples",[24],{"title":25,"links":26},"Explore Mapbox",[27,30,33],{"label":28,"to":29},"product screens","\u002Fexamples\u002Fapps\u002Fmapbox\u002Fscreens",{"label":31,"to":32},"user flows","\u002Fexamples\u002Fapps\u002Fmapbox\u002Fflows",{"label":34,"to":35},"marketing pages","\u002Fexamples\u002Fapps\u002Fmapbox\u002Fmarketing",[],{"title":38,"slug":39,"description":40,"logo":41,"url":42,"twitter_username":38,"categories":43},"Mapbox","mapbox","Mapping platform for developers","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fmapbox-fcdecd68.png","https:\u002F\u002Fwww.mapbox.com",[44,48],{"id":45,"title":46,"slug":47},44,"Maps","maps",{"id":49,"title":50,"slug":51},45,"Open Source","open-source",[],[54,306,309],{"family":55,"examples":56},"screens",[57,82,102,121,139,150,171,191,206,224,256,273],{"uuid":58,"title":59,"description":60,"canonical_path":29,"image":11,"width":61,"height":62,"image_alt":63,"kind":64,"patterns":65,"component_categories":75,"app":80},"daeffb5f-71f9-4e56-90fe-83fc11623c3e","Sign in | Mapbox","Sign-in screen where the user authenticates with their username or email and password, with options to create a new account or recover a forgotten password.",3072,1652,"Sign in | Mapbox from Mapbox","screen",[66],{"id":67,"label":68,"slug":69,"rank":70,"group":71},4,"Sign In","sign-in",0,{"id":72,"label":73,"slug":74},1,"Access & Account","access-and-account",[76],{"id":77,"title":78,"slug":79},175,"Button","button",{"slug":39,"title":38,"logo":41,"categories":81},[],{"uuid":83,"title":84,"description":85,"canonical_path":29,"image":86,"width":61,"height":62,"image_alt":87,"kind":64,"patterns":88,"component_categories":94,"app":100},"7c6178da-2efe-4d5e-b10c-0a361b78d4bc","Reset password | Mapbox","Password recovery screen where the user enters their email address to receive a reset link.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F7c6178da-2efe-4d5e-b10c-0a361b78d4bc.png","Reset password | Mapbox from Mapbox",[89],{"id":90,"label":91,"slug":92,"rank":70,"group":93},2,"Forgot Password","forgot-password",{"id":72,"label":73,"slug":74},[95,99],{"id":96,"title":97,"slug":98},240,"Horizontal navigation","horizontal-navigation",{"id":77,"title":78,"slug":79},{"slug":39,"title":38,"logo":41,"categories":101},[],{"uuid":103,"title":84,"description":104,"canonical_path":29,"image":105,"width":61,"height":62,"image_alt":87,"kind":64,"patterns":106,"component_categories":117,"app":119},"79f35a0a-7bc1-4661-82ce-6a51555bd6fc","Password recovery screen confirming that reset instructions have been sent to the user's email address.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F79f35a0a-7bc1-4661-82ce-6a51555bd6fc.png",[107,109],{"id":90,"label":91,"slug":92,"rank":70,"group":108},{"id":72,"label":73,"slug":74},{"id":110,"label":111,"slug":112,"rank":72,"group":113},122,"Success","success",{"id":114,"label":115,"slug":116},12,"States & Feedback","states-and-feedback",[118],{"id":77,"title":78,"slug":79},{"slug":39,"title":38,"logo":41,"categories":120},[],{"uuid":122,"title":123,"description":124,"canonical_path":29,"image":125,"width":61,"height":126,"image_alt":127,"kind":64,"patterns":128,"component_categories":134,"app":137},"5ea2a114-4857-407d-b193-992d72547344","Sign up | Mapbox","Signup page where the user creates a Mapbox account by providing their personal details, company name, and agreeing to the terms of service.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F5ea2a114-4857-407d-b193-992d72547344.png",2030,"Sign up | Mapbox from Mapbox",[129],{"id":130,"label":131,"slug":132,"rank":70,"group":133},5,"Sign Up","sign-up",{"id":72,"label":73,"slug":74},[135,136],{"id":96,"title":97,"slug":98},{"id":77,"title":78,"slug":79},{"slug":39,"title":38,"logo":41,"categories":138},[],{"uuid":140,"title":123,"description":141,"canonical_path":29,"image":142,"width":61,"height":126,"image_alt":127,"kind":64,"patterns":143,"component_categories":146,"app":148},"5b27a32a-ebfd-4030-b468-660d67a71c77","Signup page where the user enters their username, email, password, name, and company details to create a new account.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F5b27a32a-ebfd-4030-b468-660d67a71c77.png",[144],{"id":130,"label":131,"slug":132,"rank":70,"group":145},{"id":72,"label":73,"slug":74},[147],{"id":77,"title":78,"slug":79},{"slug":39,"title":38,"logo":41,"categories":149},[],{"uuid":151,"title":123,"description":152,"canonical_path":29,"image":153,"width":61,"height":154,"image_alt":127,"kind":64,"patterns":155,"component_categories":163,"app":169},"7329a194-81d7-4ba8-87be-8a8bc60b4666","Signup page where the user attempts to create an account but encounters a username availability error.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F7329a194-81d7-4ba8-87be-8a8bc60b4666.png",2118,[156,158],{"id":130,"label":131,"slug":132,"rank":70,"group":157},{"id":72,"label":73,"slug":74},{"id":159,"label":160,"slug":161,"rank":72,"group":162},116,"Error","error",{"id":114,"label":115,"slug":116},[164,168],{"id":165,"title":166,"slug":167},167,"Alert","alert",{"id":77,"title":78,"slug":79},{"slug":39,"title":38,"logo":41,"categories":170},[],{"uuid":172,"title":173,"description":174,"canonical_path":29,"image":175,"width":61,"height":62,"image_alt":176,"kind":64,"patterns":177,"component_categories":187,"app":189},"82c88010-651a-48ea-b697-f94f3b01415e","Account | Mapbox","Verification screen where the user is instructed to check their inbox for a confirmation link, with options to resend the email or change the address.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F82c88010-651a-48ea-b697-f94f3b01415e.png","Account | Mapbox from Mapbox",[178,183],{"id":179,"label":180,"slug":181,"rank":70,"group":182},6,"Verification","verification",{"id":72,"label":73,"slug":74},{"id":72,"label":184,"slug":185,"rank":72,"group":186},"Account Setup","account-setup",{"id":72,"label":73,"slug":74},[188],{"id":77,"title":78,"slug":79},{"slug":39,"title":38,"logo":41,"categories":190},[],{"uuid":192,"title":173,"description":193,"canonical_path":29,"image":194,"width":61,"height":62,"image_alt":176,"kind":64,"patterns":195,"component_categories":203,"app":204},"d3f47d7e-8313-48b2-b18c-6a372e63e98b","Email verification screen displaying a loading spinner while processing the confirmation token.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fd3f47d7e-8313-48b2-b18c-6a372e63e98b.png",[196,201],{"id":197,"label":198,"slug":199,"rank":70,"group":200},120,"Loading","loading",{"id":114,"label":115,"slug":116},{"id":179,"label":180,"slug":181,"rank":72,"group":202},{"id":72,"label":73,"slug":74},[],{"slug":39,"title":38,"logo":41,"categories":205},[],{"uuid":207,"title":173,"description":208,"canonical_path":29,"image":209,"width":61,"height":62,"image_alt":176,"kind":64,"patterns":210,"component_categories":220,"app":222},"c8b09969-4e03-4cc3-8c49-8256043617e4","Verification screen where the user must re-enter their password to confirm their identity before proceeding.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fc8b09969-4e03-4cc3-8c49-8256043617e4.png",[211,213,218],{"id":179,"label":180,"slug":181,"rank":70,"group":212},{"id":72,"label":73,"slug":74},{"id":214,"label":215,"slug":216,"rank":72,"group":217},114,"Confirmation","confirmation",{"id":114,"label":115,"slug":116},{"id":72,"label":184,"slug":185,"rank":90,"group":219},{"id":72,"label":73,"slug":74},[221],{"id":77,"title":78,"slug":79},{"slug":39,"title":38,"logo":41,"categories":223},[],{"uuid":225,"title":173,"description":226,"canonical_path":29,"image":227,"width":61,"height":62,"image_alt":176,"kind":64,"patterns":228,"component_categories":239,"app":254},"dcd511d6-bc87-4064-81c9-2f929a81baaa","Dashboard overlay where a new user selects their primary use case, such as web applications or fleet management, to personalize their experience.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fdcd511d6-bc87-4064-81c9-2f929a81baaa.png",[229,237],{"id":230,"label":231,"slug":232,"rank":70,"group":233},77,"Welcome","welcome",{"id":234,"label":235,"slug":236},7,"Onboarding & Education","onboarding-and-education",{"id":72,"label":184,"slug":185,"rank":72,"group":238},{"id":72,"label":73,"slug":74},[240,244,248,252,253],{"id":241,"title":242,"slug":243},284,"Modal","modal",{"id":245,"title":246,"slug":247},174,"Card","card",{"id":249,"title":250,"slug":251},169,"Avatar","avatar",{"id":96,"title":97,"slug":98},{"id":77,"title":78,"slug":79},{"slug":39,"title":38,"logo":41,"categories":255},[],{"uuid":257,"title":173,"description":258,"canonical_path":29,"image":259,"width":61,"height":62,"image_alt":176,"kind":64,"patterns":260,"component_categories":265,"app":271},"ee719999-c9c6-41e5-973a-9444542a8c92","Onboarding step where the user selects their primary use case, such as adding a map to a web application or getting trip directions, from a modal overlay.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fee719999-c9c6-41e5-973a-9444542a8c92.png",[261,263],{"id":72,"label":184,"slug":185,"rank":70,"group":262},{"id":72,"label":73,"slug":74},{"id":230,"label":231,"slug":232,"rank":72,"group":264},{"id":234,"label":235,"slug":236},[266,267,268,269,270],{"id":241,"title":242,"slug":243},{"id":249,"title":250,"slug":251},{"id":245,"title":246,"slug":247},{"id":96,"title":97,"slug":98},{"id":77,"title":78,"slug":79},{"slug":39,"title":38,"logo":41,"categories":272},[],{"uuid":274,"title":173,"description":275,"canonical_path":29,"image":276,"width":61,"height":277,"image_alt":176,"kind":64,"patterns":278,"component_categories":299,"app":304},"7741e411-7fd7-4b3e-9cc3-89463cf3ec2f","Dashboard overview providing quick start actions for map creation, a summary of account and billing details, and access to default API tokens.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F7741e411-7fd7-4b3e-9cc3-89463cf3ec2f.png",2226,[279,286,294],{"id":280,"label":281,"slug":282,"rank":70,"group":283},41,"Dashboard","dashboard",{"id":67,"label":284,"slug":285},"Data & Analysis","data-and-analysis",{"id":287,"label":288,"slug":289,"rank":72,"group":290},94,"Account Settings","account-settings",{"id":291,"label":292,"slug":293},10,"Settings & Admin","settings-and-admin",{"id":295,"label":296,"slug":297,"rank":90,"group":298},95,"API Keys","api-keys",{"id":291,"label":292,"slug":293},[300,301,302,303],{"id":249,"title":250,"slug":251},{"id":245,"title":246,"slug":247},{"id":96,"title":97,"slug":98},{"id":77,"title":78,"slug":79},{"slug":39,"title":38,"logo":41,"categories":305},[],{"family":307,"examples":308},"flows",[],{"family":310,"examples":311},"pages",[],[313,315,317,319,322,325,328,330,334,338,342],{"label":314,"to":29},"Mapbox product screens",{"label":316,"to":35},"Mapbox marketing pages",{"label":318,"to":32},"Mapbox user flows",{"label":320,"to":321},"Mapbox UI components","\u002Fexamples\u002Fapps\u002Fmapbox\u002Fcomponents",{"label":323,"to":324},"Maps app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fmaps",{"label":326,"to":327},"Open Source app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fopen-source",{"label":329,"to":18},"All SaaS app examples",{"label":331,"to":332,"description":333},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":335,"to":336,"description":337},"SaaS marketing page examples","\u002Fexamples\u002Fpages","Browse real SaaS marketing pages grouped by page type, from landing pages to pricing and customer story pages.",{"label":339,"to":340,"description":341},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":343,"to":344,"description":345},"User flow examples from SaaS apps","\u002Fexamples\u002Fflows","Explore user flow examples for sign-up, onboarding, billing, and other SaaS tasks. Compare the order of screens and preview the opening steps from real apps.",{"published_at":347,"updated_at":348},"2016-07-01T15:30:28.000Z","2026-09-13T13:02:39.000Z"]