[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fclover\u002Fscreens":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":39,"showcases":293,"links":294,"dates":349},"\u002Fexamples\u002Fapps\u002Fclover\u002Fscreens","detail","screens",true,{"title":9,"description":10,"og_image":11},"Clover product screens examples - Nicelydone","Browse Clover screen design examples. Preview the interface screenshots and explore related UI patterns. The all-in-one notebook for creatives.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fclover_sign-in_dd130de1_nicelydone.png",[13,16,19,22],{"label":14,"to":15},"Examples","\u002Fexamples",{"label":17,"to":18},"SaaS app design examples","\u002Fexamples\u002Fapps",{"label":20,"to":21},"Clover design examples","\u002Fexamples\u002Fapps\u002Fclover",{"label":23,"to":4},"Clover product screens examples",{"title":23,"eyebrow":25,"description":10,"sections":26,"body":27},"SaaS app examples",[],[],{"title":29,"slug":30,"description":31,"logo":32,"url":33,"categories":34},"Clover","clover","The all-in-one notebook for creatives.","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fclover-400862d8.png","https:\u002F\u002Fcloverapp.co",[35],{"id":36,"title":37,"slug":38},22,"Knowledge Management","knowledge-management",[40,65,78,98,127,146,160,193,211,238,254,274],{"uuid":41,"title":42,"description":43,"canonical_path":4,"image":11,"width":44,"height":45,"image_alt":46,"kind":47,"patterns":48,"component_categories":58,"app":63},"5bb95d1a-d6f0-4ea7-985b-436e1951256f","Clover - Sign In","Sign-in screen where early testers authenticate with email and password, featuring a prompt to join the waitlist for updates.",3072,1654,"Clover - Sign In from Clover","screen",[49],{"id":50,"label":51,"slug":52,"rank":53,"group":54},2,"Forgot Password","forgot-password",0,{"id":55,"label":56,"slug":57},1,"Access & Account","access-and-account",[59],{"id":60,"title":61,"slug":62},175,"Button","button",{"slug":30,"title":29,"logo":32,"categories":64},[],{"uuid":66,"title":67,"description":68,"canonical_path":4,"image":69,"width":44,"height":45,"image_alt":70,"kind":47,"patterns":71,"component_categories":74,"app":76},"ea1313e4-c657-43af-a5c6-bbca96ce42a2","Clover - Forgot Password","Password recovery screen where the user enters their email address to request a reset link.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fclover_password-reset_d0717f5a_nicelydone.png","Clover - Forgot Password from Clover",[72],{"id":50,"label":51,"slug":52,"rank":53,"group":73},{"id":55,"label":56,"slug":57},[75],{"id":60,"title":61,"slug":62},{"slug":30,"title":29,"logo":32,"categories":77},[],{"uuid":79,"title":80,"description":81,"canonical_path":4,"image":82,"width":44,"height":45,"image_alt":83,"kind":47,"patterns":84,"component_categories":94,"app":96},"79aef37f-51b5-4e73-9de2-4bc1ed3bcce7","Clover - Where Ideas Grow","Signup screen where the user sets up their account by entering their full name and a password.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fclover_sign-up_001ef607_nicelydone.png","Clover - Where Ideas Grow from Clover",[85,89],{"id":55,"label":86,"slug":87,"rank":53,"group":88},"Account Setup","account-setup",{"id":55,"label":56,"slug":57},{"id":90,"label":91,"slug":92,"rank":55,"group":93},5,"Sign Up","sign-up",{"id":55,"label":56,"slug":57},[95],{"id":60,"title":61,"slug":62},{"slug":30,"title":29,"logo":32,"categories":97},[],{"uuid":99,"title":80,"description":100,"canonical_path":4,"image":101,"width":44,"height":45,"image_alt":83,"kind":47,"patterns":102,"component_categories":119,"app":125},"82c1ed63-225b-4fb9-8815-74e262753203","Onboarding step where the user names their workspace and sets a workspace icon.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fclover_onboarding_c9f9b3b9_nicelydone.png",[103,111],{"id":104,"label":105,"slug":106,"rank":53,"group":107},74,"Onboarding Checklist","onboarding-checklist",{"id":108,"label":109,"slug":110},7,"Onboarding & Education","onboarding-and-education",{"id":112,"label":113,"slug":114,"rank":55,"group":115},71,"Workspace Switcher","workspace-switcher",{"id":116,"label":117,"slug":118},6,"Navigation & Commands","navigation-and-commands",[120,124],{"id":121,"title":122,"slug":123},169,"Avatar","avatar",{"id":60,"title":61,"slug":62},{"slug":30,"title":29,"logo":32,"categories":126},[],{"uuid":128,"title":80,"description":129,"canonical_path":4,"image":130,"width":44,"height":45,"image_alt":83,"kind":47,"patterns":131,"component_categories":142,"app":144},"a79df9a3-198f-475f-8de1-5a24452ed8f2","Onboarding step where the user customizes their editor by selecting a light or dark theme and a highlight color.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fclover_onboarding-password-reset_b4bec89a_nicelydone.png",[132,134],{"id":55,"label":86,"slug":87,"rank":53,"group":133},{"id":55,"label":56,"slug":57},{"id":135,"label":136,"slug":137,"rank":55,"group":138},102,"Settings","settings",{"id":139,"label":140,"slug":141},10,"Settings & Admin","settings-and-admin",[143],{"id":60,"title":61,"slug":62},{"slug":30,"title":29,"logo":32,"categories":145},[],{"uuid":147,"title":80,"description":148,"canonical_path":4,"image":149,"width":44,"height":45,"image_alt":83,"kind":47,"patterns":150,"component_categories":156,"app":158},"9d7ed2ac-8ca2-4b28-bcbd-3812e57e86a4","Onboarding screen where the user reads an alpha disclaimer and clicks start to enter the workspace.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fclover_onboarding_c2b3e0f8_nicelydone.png",[151],{"id":152,"label":153,"slug":154,"rank":53,"group":155},77,"Welcome","welcome",{"id":108,"label":109,"slug":110},[157],{"id":60,"title":61,"slug":62},{"slug":30,"title":29,"logo":32,"categories":159},[],{"uuid":161,"title":162,"description":163,"canonical_path":4,"image":164,"width":44,"height":45,"image_alt":165,"kind":47,"patterns":166,"component_categories":189,"app":191},"7ea23641-5ad9-4806-99b1-7d8071f64681","Welcome to Clover! - Bertrand","Design editor where the user learns how to navigate the infinite canvas, use drawing tools, and add text blocks via an interactive welcome document.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fclover_home-product-logged-detail-page-single-page_3b66e4da_nicelydone.png","Welcome to Clover! - Bertrand from Clover",[167,169,176,181],{"id":152,"label":153,"slug":154,"rank":53,"group":168},{"id":108,"label":109,"slug":110},{"id":170,"label":171,"slug":172,"rank":55,"group":173},55,"Design Editor","design-editor",{"id":90,"label":174,"slug":175},"Media & Tools","media-and-tools",{"id":177,"label":178,"slug":179,"rank":50,"group":180},72,"Getting Started","getting-started",{"id":108,"label":109,"slug":110},{"id":182,"label":183,"slug":184,"rank":185,"group":186},24,"Share","share",3,{"id":50,"label":187,"slug":188},"Actions","actions",[190],{"id":60,"title":61,"slug":62},{"slug":30,"title":29,"logo":32,"categories":192},[],{"uuid":194,"title":162,"description":195,"canonical_path":4,"image":196,"width":44,"height":45,"image_alt":165,"kind":47,"patterns":197,"component_categories":204,"app":209},"e0b84e46-c6bb-48b2-aa71-f606562e23e9","Whiteboard canvas editor where the user explores a welcome document explaining how to use the surface, text, and drawing tools, with a share menu open.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fclover_share-dropdown-other-states_e46fc1ae_nicelydone.png",[198,200,202],{"id":152,"label":153,"slug":154,"rank":53,"group":199},{"id":108,"label":109,"slug":110},{"id":170,"label":171,"slug":172,"rank":55,"group":201},{"id":90,"label":174,"slug":175},{"id":182,"label":183,"slug":184,"rank":50,"group":203},{"id":50,"label":187,"slug":188},[205],{"id":206,"title":207,"slug":208},214,"Popover","popover",{"slug":30,"title":29,"logo":32,"categories":210},[],{"uuid":212,"title":162,"description":213,"canonical_path":4,"image":214,"width":44,"height":45,"image_alt":165,"kind":47,"patterns":215,"component_categories":230,"app":236},"74220b93-fee8-4c14-83ac-f3af0fc7fff3","Whiteboard editor where the user learns how to navigate the canvas, write text, and use drawing tools during onboarding.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fclover_settings_42d180be_nicelydone.png",[216,221,226,228],{"id":217,"label":218,"slug":219,"rank":53,"group":220},73,"Guided Tour","guided-tour",{"id":108,"label":109,"slug":110},{"id":222,"label":223,"slug":224,"rank":55,"group":225},56,"Drawing","drawing",{"id":90,"label":174,"slug":175},{"id":152,"label":153,"slug":154,"rank":50,"group":227},{"id":108,"label":109,"slug":110},{"id":170,"label":171,"slug":172,"rank":185,"group":229},{"id":90,"label":174,"slug":175},[231,235],{"id":232,"title":233,"slug":234},277,"Button group","button-group",{"id":60,"title":61,"slug":62},{"slug":30,"title":29,"logo":32,"categories":237},[],{"uuid":239,"title":162,"description":240,"canonical_path":4,"image":241,"width":44,"height":45,"image_alt":165,"kind":47,"patterns":242,"component_categories":249,"app":252},"c6ec38d4-6e08-4a02-b6cf-b556b740860e","Whiteboard editor where the user views an interactive welcome document explaining canvas navigation, writing, and drawing tools.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fclover_actions_40f71696_nicelydone.png",[243,245,247],{"id":152,"label":153,"slug":154,"rank":53,"group":244},{"id":108,"label":109,"slug":110},{"id":170,"label":171,"slug":172,"rank":55,"group":246},{"id":90,"label":174,"slug":175},{"id":182,"label":183,"slug":184,"rank":50,"group":248},{"id":50,"label":187,"slug":188},[250,251],{"id":232,"title":233,"slug":234},{"id":60,"title":61,"slug":62},{"slug":30,"title":29,"logo":32,"categories":253},[],{"uuid":255,"title":162,"description":256,"canonical_path":4,"image":257,"width":44,"height":45,"image_alt":165,"kind":47,"patterns":258,"component_categories":268,"app":272},"8a5c8ac5-5c21-4b56-a8ef-bf203705931c","Whiteboard editor where the user is formatting a text block using a floating toolbar amidst sticky notes and hand-drawn arrows.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fclover_content-editor_63f3196e_nicelydone.png",[259,261,266],{"id":170,"label":171,"slug":172,"rank":53,"group":260},{"id":90,"label":174,"slug":175},{"id":262,"label":263,"slug":264,"rank":55,"group":265},11,"Edit","edit",{"id":50,"label":187,"slug":188},{"id":182,"label":183,"slug":184,"rank":50,"group":267},{"id":50,"label":187,"slug":188},[269,270,271],{"id":232,"title":233,"slug":234},{"id":121,"title":122,"slug":123},{"id":60,"title":61,"slug":62},{"slug":30,"title":29,"logo":32,"categories":273},[],{"uuid":275,"title":162,"description":276,"canonical_path":4,"image":277,"width":44,"height":45,"image_alt":165,"kind":47,"patterns":278,"component_categories":285,"app":291},"2c84a1ee-02b9-43e4-ae06-bcc206be48aa","Design editor where the user organizes brainstorming ideas on an infinite canvas with text blocks, sticky notes, and drawing tools, currently interacting with an object's context menu.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fclover_actions_6d43c3fe_nicelydone.png",[279,281,283],{"id":170,"label":171,"slug":172,"rank":53,"group":280},{"id":90,"label":174,"slug":175},{"id":262,"label":263,"slug":264,"rank":55,"group":282},{"id":50,"label":187,"slug":188},{"id":182,"label":183,"slug":184,"rank":50,"group":284},{"id":50,"label":187,"slug":188},[286,290],{"id":287,"title":288,"slug":289},240,"Horizontal navigation","horizontal-navigation",{"id":121,"title":122,"slug":123},{"slug":30,"title":29,"logo":32,"categories":292},[],[],[295,297,299,301,303,305,307,309,311,313,315,317,319,322,325,328,331,333,337,341,345],{"label":171,"to":296},"\u002Fexamples\u002Fscreens\u002Fdesign-editor",{"label":183,"to":298},"\u002Fexamples\u002Fscreens\u002Fshare",{"label":153,"to":300},"\u002Fexamples\u002Fscreens\u002Fwelcome",{"label":86,"to":302},"\u002Fexamples\u002Fscreens\u002Faccount-setup",{"label":263,"to":304},"\u002Fexamples\u002Fscreens\u002Fedit",{"label":51,"to":306},"\u002Fexamples\u002Fscreens\u002Fforgot-password",{"label":223,"to":308},"\u002Fexamples\u002Fscreens\u002Fdrawing",{"label":178,"to":310},"\u002Fexamples\u002Fscreens\u002Fgetting-started",{"label":218,"to":312},"\u002Fexamples\u002Fscreens\u002Fguided-tour",{"label":105,"to":314},"\u002Fexamples\u002Fscreens\u002Fonboarding-checklist",{"label":136,"to":316},"\u002Fexamples\u002Fscreens\u002Fsettings",{"label":91,"to":318},"\u002Fexamples\u002Fscreens\u002Fsign-up",{"label":320,"to":321},"Clover marketing pages","\u002Fexamples\u002Fapps\u002Fclover\u002Fmarketing",{"label":323,"to":324},"Clover user flows","\u002Fexamples\u002Fapps\u002Fclover\u002Fflows",{"label":326,"to":327},"Clover UI components","\u002Fexamples\u002Fapps\u002Fclover\u002Fcomponents",{"label":329,"to":330},"Knowledge Management app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fknowledge-management",{"label":332,"to":18},"All SaaS app examples",{"label":334,"to":335,"description":336},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":338,"to":339,"description":340},"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":342,"to":343,"description":344},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":346,"to":347,"description":348},"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":350,"updated_at":351},"2020-12-08T19:10:00.000Z","2026-09-13T13:02:39.000Z"]