[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fframer":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":21,"app":40,"examples":63,"showcases":64,"links":337,"dates":373},"\u002Fexamples\u002Fapps\u002Fframer","detail","apps",true,{"title":9,"description":10,"og_image":11},"Framer design examples - Nicelydone","Explore Framer UI design examples. Always interactive, lightning fast design.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F58af08f8-4074-4d30-af93-9cbf34699cf3.png",[13,16,19],{"label":14,"to":15},"Examples","\u002Fexamples",{"label":17,"to":18},"SaaS app design examples","\u002Fexamples\u002Fapps",{"label":20,"to":4},"Framer design examples",{"title":20,"eyebrow":22,"description":10,"sections":23,"body":39},"SaaS app examples",[24],{"title":25,"links":26},"Explore Framer",[27,30,33,36],{"label":28,"to":29},"product screens","\u002Fexamples\u002Fapps\u002Fframer\u002Fscreens",{"label":31,"to":32},"user flows","\u002Fexamples\u002Fapps\u002Fframer\u002Fflows",{"label":34,"to":35},"UI components","\u002Fexamples\u002Fapps\u002Fframer\u002Fcomponents",{"label":37,"to":38},"marketing pages","\u002Fexamples\u002Fapps\u002Fframer\u002Fmarketing",[],{"title":41,"slug":42,"description":43,"logo":44,"url":45,"categories":46},"Framer","framer","Always interactive, lightning fast design.","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fframer-4ee13abb.png","http:\u002F\u002Fframer.com\u002Fweb",[47,51,55,59],{"id":48,"title":49,"slug":50},8,"Design","design",{"id":52,"title":53,"slug":54},7,"Web Development","web-development",{"id":56,"title":57,"slug":58},80,"Artificial Intelligence","artificial-intelligence",{"id":60,"title":61,"slug":62},96,"No code","no-code",[],[65,328,331,334],{"family":66,"examples":67},"screens",[68,97,109,120,142,154,166,182,198,210,265,302],{"uuid":69,"title":70,"description":71,"canonical_path":29,"image":11,"width":72,"height":73,"image_alt":74,"kind":75,"patterns":76,"component_categories":86,"app":95},"58af08f8-4074-4d30-af93-9cbf34699cf3","Framer Login","Sign-in screen where the user authenticates with Google or email over a blurred showcase background.",3024,1686,"Framer Login from Framer","screen",[77],{"id":78,"label":79,"slug":80,"rank":81,"group":82},4,"Sign In","sign-in",0,{"id":83,"label":84,"slug":85},1,"Access & Account","access-and-account",[87,91],{"id":88,"title":89,"slug":90},175,"Button","button",{"id":92,"title":93,"slug":94},174,"Card","card",{"slug":42,"title":41,"logo":44,"categories":96},[],{"uuid":98,"title":70,"description":99,"canonical_path":29,"image":100,"width":72,"height":73,"image_alt":74,"kind":75,"patterns":101,"component_categories":104,"app":107},"bba7c8af-490b-4135-a4a2-6d4dfd7172a3","Sign-in screen where the user authenticates with Google or enters their email to continue.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fbba7c8af-490b-4135-a4a2-6d4dfd7172a3.png",[102],{"id":78,"label":79,"slug":80,"rank":81,"group":103},{"id":83,"label":84,"slug":85},[105,106],{"id":88,"title":89,"slug":90},{"id":92,"title":93,"slug":94},{"slug":42,"title":41,"logo":44,"categories":108},[],{"uuid":110,"title":70,"description":99,"canonical_path":29,"image":111,"width":72,"height":73,"image_alt":74,"kind":75,"patterns":112,"component_categories":115,"app":118},"df78c5a4-2b27-4832-8315-95d21f5eb6bb","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fdf78c5a4-2b27-4832-8315-95d21f5eb6bb.png",[113],{"id":78,"label":79,"slug":80,"rank":81,"group":114},{"id":83,"label":84,"slug":85},[116,117],{"id":88,"title":89,"slug":90},{"id":92,"title":93,"slug":94},{"slug":42,"title":41,"logo":44,"categories":119},[],{"uuid":121,"title":70,"description":122,"canonical_path":29,"image":123,"width":72,"height":73,"image_alt":74,"kind":75,"patterns":124,"component_categories":138,"app":140},"88093e53-69e3-4c6a-a3bb-527c85641094","Verification screen prompting the user to check their inbox for an activation link to continue.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F88093e53-69e3-4c6a-a3bb-527c85641094.png",[125,130],{"id":126,"label":127,"slug":128,"rank":81,"group":129},6,"Verification","verification",{"id":83,"label":84,"slug":85},{"id":131,"label":132,"slug":133,"rank":83,"group":134},114,"Confirmation","confirmation",{"id":135,"label":136,"slug":137},12,"States & Feedback","states-and-feedback",[139],{"id":92,"title":93,"slug":94},{"slug":42,"title":41,"logo":44,"categories":141},[],{"uuid":143,"title":70,"description":144,"canonical_path":29,"image":145,"width":72,"height":73,"image_alt":74,"kind":75,"patterns":146,"component_categories":149,"app":152},"4b3847d4-5c0f-4402-a3e3-aff194cbf61f","Sign-in screen where the user authenticates with Google or email.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F4b3847d4-5c0f-4402-a3e3-aff194cbf61f.png",[147],{"id":78,"label":79,"slug":80,"rank":81,"group":148},{"id":83,"label":84,"slug":85},[150,151],{"id":88,"title":89,"slug":90},{"id":92,"title":93,"slug":94},{"slug":42,"title":41,"logo":44,"categories":153},[],{"uuid":155,"title":70,"description":156,"canonical_path":29,"image":157,"width":72,"height":73,"image_alt":74,"kind":75,"patterns":158,"component_categories":161,"app":164},"c386b5ad-01d7-4f5e-876d-e138a94a38bd","Sign-in screen where the user authenticates with Google or enters their email address to continue.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fc386b5ad-01d7-4f5e-876d-e138a94a38bd.png",[159],{"id":78,"label":79,"slug":80,"rank":81,"group":160},{"id":83,"label":84,"slug":85},[162,163],{"id":88,"title":89,"slug":90},{"id":92,"title":93,"slug":94},{"slug":42,"title":41,"logo":44,"categories":165},[],{"uuid":167,"title":70,"description":168,"canonical_path":29,"image":169,"width":72,"height":73,"image_alt":74,"kind":75,"patterns":170,"component_categories":178,"app":180},"b30f8106-ae90-4126-9ab1-c6599169647a","Verification screen prompting the user to check their inbox for an activation link, with an inline option to resend the email.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fb30f8106-ae90-4126-9ab1-c6599169647a.png",[171,173],{"id":126,"label":127,"slug":128,"rank":81,"group":172},{"id":83,"label":84,"slug":85},{"id":174,"label":175,"slug":176,"rank":83,"group":177},5,"Sign Up","sign-up",{"id":83,"label":84,"slug":85},[179],{"id":92,"title":93,"slug":94},{"slug":42,"title":41,"logo":44,"categories":181},[],{"uuid":183,"title":70,"description":184,"canonical_path":29,"image":185,"width":72,"height":73,"image_alt":74,"kind":75,"patterns":186,"component_categories":193,"app":196},"84d384a1-cad1-4b52-bf01-47e8ca2431d7","Signup screen where the user enters their first and last name to complete account creation with a pre-filled email address.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F84d384a1-cad1-4b52-bf01-47e8ca2431d7.png",[187,191],{"id":83,"label":188,"slug":189,"rank":81,"group":190},"Account Setup","account-setup",{"id":83,"label":84,"slug":85},{"id":174,"label":175,"slug":176,"rank":83,"group":192},{"id":83,"label":84,"slug":85},[194,195],{"id":88,"title":89,"slug":90},{"id":92,"title":93,"slug":94},{"slug":42,"title":41,"logo":44,"categories":197},[],{"uuid":199,"title":70,"description":200,"canonical_path":29,"image":201,"width":72,"height":73,"image_alt":74,"kind":75,"patterns":202,"component_categories":205,"app":208},"fc8ce4d2-68a4-4e8b-8b9a-5ac433272d23","Signup screen where the user provides their first and last name along with an email address to create an account, and accepts the terms of service.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ffc8ce4d2-68a4-4e8b-8b9a-5ac433272d23.png",[203],{"id":174,"label":175,"slug":176,"rank":81,"group":204},{"id":83,"label":84,"slug":85},[206,207],{"id":88,"title":89,"slug":90},{"id":92,"title":93,"slug":94},{"slug":42,"title":41,"logo":44,"categories":209},[],{"uuid":211,"title":212,"description":213,"canonical_path":29,"image":214,"width":72,"height":73,"image_alt":215,"kind":75,"patterns":216,"component_categories":237,"app":263},"06240c7e-13a8-4a73-903e-b1253c44b814","Untitled – Framer","Design editor where a new user lands on a blank canvas with a 5-step onboarding checklist to get started.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F06240c7e-13a8-4a73-903e-b1253c44b814.png","Untitled – Framer from Framer",[217,224,229],{"id":218,"label":219,"slug":220,"rank":81,"group":221},74,"Onboarding Checklist","onboarding-checklist",{"id":52,"label":222,"slug":223},"Onboarding & Education","onboarding-and-education",{"id":225,"label":226,"slug":227,"rank":83,"group":228},72,"Getting Started","getting-started",{"id":52,"label":222,"slug":223},{"id":230,"label":231,"slug":232,"rank":233,"group":234},55,"Design Editor","design-editor",2,{"id":174,"label":235,"slug":236},"Media & Tools","media-and-tools",[238,242,246,250,254,258,262],{"id":239,"title":240,"slug":241},169,"Avatar","avatar",{"id":243,"title":244,"slug":245},233,"Tabs","tabs",{"id":247,"title":248,"slug":249},168,"Accordion","accordion",{"id":251,"title":252,"slug":253},277,"Button group","button-group",{"id":255,"title":256,"slug":257},240,"Horizontal navigation","horizontal-navigation",{"id":259,"title":260,"slug":261},260,"Badge","badge",{"id":88,"title":89,"slug":90},{"slug":42,"title":41,"logo":44,"categories":264},[],{"uuid":266,"title":41,"description":267,"canonical_path":29,"image":268,"width":72,"height":73,"image_alt":269,"kind":75,"patterns":270,"component_categories":295,"app":300},"344053ef-5c72-4f42-b52e-2532e5c03ea0","Workspace home page where the user views their recent design projects, searches files, and can create new projects or invite members.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F344053ef-5c72-4f42-b52e-2532e5c03ea0.png","Framer from Framer",[271,278,282,289],{"id":272,"label":273,"slug":274,"rank":81,"group":275},81,"Home","home",{"id":48,"label":276,"slug":277},"Pages & Content","pages-and-content",{"id":56,"label":279,"slug":280,"rank":83,"group":281},"Files","files",{"id":48,"label":276,"slug":277},{"id":283,"label":284,"slug":285,"rank":233,"group":286},133,"Invite Teammates","invite-teammates",{"id":233,"label":287,"slug":288},"Actions","actions",{"id":290,"label":291,"slug":292,"rank":293,"group":294},22,"Search","search",3,{"id":233,"label":287,"slug":288},[296,297,298,299],{"id":255,"title":256,"slug":257},{"id":259,"title":260,"slug":261},{"id":88,"title":89,"slug":90},{"id":92,"title":93,"slug":94},{"slug":42,"title":41,"logo":44,"categories":301},[],{"uuid":303,"title":41,"description":304,"canonical_path":29,"image":305,"width":72,"height":73,"image_alt":269,"kind":75,"patterns":306,"component_categories":322,"app":326},"013998e8-bf7a-49c6-9b2f-5bb7e21f77da","Home screen where the user views their recent projects in a grid and can create new files or invite members.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F013998e8-bf7a-49c6-9b2f-5bb7e21f77da.png",[307,309,311,313,320],{"id":272,"label":273,"slug":274,"rank":81,"group":308},{"id":48,"label":276,"slug":277},{"id":56,"label":279,"slug":280,"rank":83,"group":310},{"id":48,"label":276,"slug":277},{"id":283,"label":284,"slug":285,"rank":233,"group":312},{"id":233,"label":287,"slug":288},{"id":314,"label":315,"slug":316,"rank":293,"group":317},71,"Workspace Switcher","workspace-switcher",{"id":126,"label":318,"slug":319},"Navigation & Commands","navigation-and-commands",{"id":290,"label":291,"slug":292,"rank":78,"group":321},{"id":233,"label":287,"slug":288},[323,324,325],{"id":255,"title":256,"slug":257},{"id":259,"title":260,"slug":261},{"id":92,"title":93,"slug":94},{"slug":42,"title":41,"logo":44,"categories":327},[],{"family":329,"examples":330},"flows",[],{"family":332,"examples":333},"components",[],{"family":335,"examples":336},"pages",[],[338,340,342,344,346,349,352,355,357,361,365,369],{"label":339,"to":29},"Framer product screens",{"label":341,"to":38},"Framer marketing pages",{"label":343,"to":32},"Framer user flows",{"label":345,"to":35},"Framer UI components",{"label":347,"to":348},"Design app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fdesign",{"label":350,"to":351},"Web Development app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fweb-development",{"label":353,"to":354},"Artificial Intelligence app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fartificial-intelligence",{"label":356,"to":18},"All SaaS app examples",{"label":358,"to":359,"description":360},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":362,"to":363,"description":364},"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":366,"to":367,"description":368},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":370,"to":371,"description":372},"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":374,"updated_at":375},"2020-03-02T13:13:20.000Z","2026-09-13T13:02:39.000Z"]