[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fbuy-me-a-coffee\u002Fscreens":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":43,"showcases":309,"links":310,"dates":368},"\u002Fexamples\u002Fapps\u002Fbuy-me-a-coffee\u002Fscreens","detail","screens",true,{"title":9,"description":10,"og_image":11},"Buy Me a Coffee product screens examples - Nicelydone","Browse Buy Me a Coffee screen design examples. Preview the interface screenshots and explore related UI patterns. A supporter is worth a thousand followers","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Feeac8652-d921-40b3-80f6-8d5827ef45ac.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},"Buy Me a Coffee design examples","\u002Fexamples\u002Fapps\u002Fbuy-me-a-coffee",{"label":23,"to":4},"Buy Me a Coffee 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},"Buy Me a Coffee","buy-me-a-coffee","A supporter is worth a thousand followers","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fbuy-me-a-coffee-61831f6a.png","https:\u002F\u002Fwww.buymeacoffee.com",[35,39],{"id":36,"title":37,"slug":38},39,"Payments","payments",{"id":40,"title":41,"slug":42},34,"Crowdfunding","crowdfunding",[44,69,88,104,121,134,166,184,202,221,245,284],{"uuid":45,"title":46,"description":47,"canonical_path":4,"image":11,"width":48,"height":49,"image_alt":50,"kind":51,"patterns":52,"component_categories":62,"app":67},"eeac8652-d921-40b3-80f6-8d5827ef45ac","Login - Buy Me a Coffee","Sign-in screen where the user authenticates via an email magic link or through social providers like Twitter, Google, Facebook, and Apple.",3072,1700,"Login - Buy Me a Coffee from Buy Me a Coffee","screen",[53],{"id":54,"label":55,"slug":56,"rank":57,"group":58},4,"Sign In","sign-in",0,{"id":59,"label":60,"slug":61},1,"Access & Account","access-and-account",[63],{"id":64,"title":65,"slug":66},175,"Button","button",{"slug":30,"title":29,"logo":32,"categories":68},[],{"uuid":70,"title":46,"description":71,"canonical_path":4,"image":72,"width":48,"height":49,"image_alt":50,"kind":51,"patterns":73,"component_categories":84,"app":86},"d3b8ed59-1404-43c5-8f9d-75399595dbb7","Sign-in screen showing an error message for an unregistered email address, with alternative login options via Twitter, Google, Facebook, and Apple.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fd3b8ed59-1404-43c5-8f9d-75399595dbb7.png",[74,76],{"id":54,"label":55,"slug":56,"rank":57,"group":75},{"id":59,"label":60,"slug":61},{"id":77,"label":78,"slug":79,"rank":59,"group":80},116,"Error","error",{"id":81,"label":82,"slug":83},12,"States & Feedback","states-and-feedback",[85],{"id":64,"title":65,"slug":66},{"slug":30,"title":29,"logo":32,"categories":87},[],{"uuid":89,"title":90,"description":91,"canonical_path":4,"image":92,"width":48,"height":49,"image_alt":93,"kind":51,"patterns":94,"component_categories":100,"app":102},"ab3f46df-0326-4995-aeb5-bad4da4d16c7","Sign Up - Buy Me a Coffee","Signup screen where the user creates an account using email and password or authenticates via Twitter, Google, Facebook, or Apple.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fab3f46df-0326-4995-aeb5-bad4da4d16c7.png","Sign Up - Buy Me a Coffee from Buy Me a Coffee",[95],{"id":96,"label":97,"slug":98,"rank":57,"group":99},5,"Sign Up","sign-up",{"id":59,"label":60,"slug":61},[101],{"id":64,"title":65,"slug":66},{"slug":30,"title":29,"logo":32,"categories":103},[],{"uuid":105,"title":90,"description":106,"canonical_path":4,"image":107,"width":48,"height":108,"image_alt":93,"kind":51,"patterns":109,"component_categories":117,"app":119},"1111c982-648e-4f26-9181-17205860c9c2","Signup page where the user enters their email and password, verifies a login code, or authenticates via Twitter, Google, Facebook, or Apple.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F1111c982-648e-4f26-9181-17205860c9c2.png",1702,[110,112],{"id":96,"label":97,"slug":98,"rank":57,"group":111},{"id":59,"label":60,"slug":61},{"id":113,"label":114,"slug":115,"rank":59,"group":116},6,"Verification","verification",{"id":59,"label":60,"slug":61},[118],{"id":64,"title":65,"slug":66},{"slug":30,"title":29,"logo":32,"categories":120},[],{"uuid":122,"title":90,"description":123,"canonical_path":4,"image":124,"width":48,"height":108,"image_alt":93,"kind":51,"patterns":125,"component_categories":130,"app":132},"25501532-e9ef-426b-bbb6-36faf01b39d5","Signup screen where the user enters their email, password, and a verification code sent to their email, with options to authenticate via Twitter, Google, Facebook, or Apple.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F25501532-e9ef-426b-bbb6-36faf01b39d5.png",[126,128],{"id":96,"label":97,"slug":98,"rank":57,"group":127},{"id":59,"label":60,"slug":61},{"id":113,"label":114,"slug":115,"rank":59,"group":129},{"id":59,"label":60,"slug":61},[131],{"id":64,"title":65,"slug":66},{"slug":30,"title":29,"logo":32,"categories":133},[],{"uuid":135,"title":136,"description":137,"canonical_path":4,"image":138,"width":48,"height":139,"image_alt":140,"kind":51,"patterns":141,"component_categories":162,"app":164},"36d99842-3bd2-497a-9345-6cfe3d9553a7","Signup - Buy Me a Coffee","Onboarding step where the user completes their creator profile by adding a photo, name, custom Buy Me a Coffee link, bio, and website.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F36d99842-3bd2-497a-9345-6cfe3d9553a7.png",2024,"Signup - Buy Me a Coffee from Buy Me a Coffee",[142,146,154],{"id":59,"label":143,"slug":144,"rank":57,"group":145},"Account Setup","account-setup",{"id":59,"label":60,"slug":61},{"id":147,"label":148,"slug":149,"rank":59,"group":150},3,"Profile","profile",{"id":151,"label":152,"slug":153},11,"Social & Collaboration","social-and-collaboration",{"id":155,"label":156,"slug":157,"rank":158,"group":159},7,"Add & Create","add-and-create",2,{"id":158,"label":160,"slug":161},"Actions","actions",[163],{"id":64,"title":65,"slug":66},{"slug":30,"title":29,"logo":32,"categories":165},[],{"uuid":167,"title":136,"description":168,"canonical_path":4,"image":169,"width":48,"height":139,"image_alt":140,"kind":51,"patterns":170,"component_categories":180,"app":182},"e90eb702-cf56-495a-a467-44c473816ff5","Onboarding step where the user sets their display name, custom URL, bio, and social link.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fe90eb702-cf56-495a-a467-44c473816ff5.png",[171,173,175],{"id":59,"label":143,"slug":144,"rank":57,"group":172},{"id":59,"label":60,"slug":61},{"id":147,"label":148,"slug":149,"rank":59,"group":174},{"id":151,"label":152,"slug":153},{"id":176,"label":177,"slug":178,"rank":158,"group":179},25,"Upload & Download","upload-and-download",{"id":158,"label":160,"slug":161},[181],{"id":64,"title":65,"slug":66},{"slug":30,"title":29,"logo":32,"categories":183},[],{"uuid":185,"title":136,"description":186,"canonical_path":4,"image":187,"width":48,"height":188,"image_alt":140,"kind":51,"patterns":189,"component_categories":198,"app":200},"f71f9fab-bf05-4aeb-8393-e4ab9be5e6f2","Onboarding step where the user completes their page by uploading a profile picture, setting a custom URL, and adding a description, currently showing validation errors.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ff71f9fab-bf05-4aeb-8393-e4ab9be5e6f2.png",2080,[190,192,196],{"id":59,"label":143,"slug":144,"rank":57,"group":191},{"id":59,"label":60,"slug":61},{"id":151,"label":193,"slug":194,"rank":59,"group":195},"Edit","edit",{"id":158,"label":160,"slug":161},{"id":77,"label":78,"slug":79,"rank":158,"group":197},{"id":81,"label":82,"slug":83},[199],{"id":64,"title":65,"slug":66},{"slug":30,"title":29,"logo":32,"categories":201},[],{"uuid":203,"title":136,"description":204,"canonical_path":4,"image":205,"width":48,"height":206,"image_alt":140,"kind":51,"patterns":207,"component_categories":214,"app":219},"d43877af-5cd4-4d97-a274-68a6a7cf5d83","Onboarding step where the user completes their creator profile by entering a name, custom URL, description, and website link, currently showing a validation error.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fd43877af-5cd4-4d97-a274-68a6a7cf5d83.png",1652,[208,210,212],{"id":59,"label":143,"slug":144,"rank":57,"group":209},{"id":59,"label":60,"slug":61},{"id":147,"label":148,"slug":149,"rank":59,"group":211},{"id":151,"label":152,"slug":153},{"id":77,"label":78,"slug":79,"rank":158,"group":213},{"id":81,"label":82,"slug":83},[215],{"id":216,"title":217,"slug":218},169,"Avatar","avatar",{"slug":30,"title":29,"logo":32,"categories":220},[],{"uuid":222,"title":223,"description":224,"canonical_path":4,"image":225,"width":48,"height":206,"image_alt":226,"kind":51,"patterns":227,"component_categories":238,"app":243},"58fa3751-99e7-4349-9cf0-64ae285ca2f7","Select Payment method - Buy Me A Coffee","Onboarding step where the user selects their preferred currency and chooses between standard or instant Stripe payouts.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F58fa3751-99e7-4349-9cf0-64ae285ca2f7.png","Select Payment method - Buy Me A Coffee from Buy Me a Coffee",[228,230],{"id":59,"label":143,"slug":144,"rank":57,"group":229},{"id":59,"label":60,"slug":61},{"id":231,"label":232,"slug":233,"rank":59,"group":234},132,"Payment Method","payment-method",{"id":235,"label":236,"slug":237},14,"Payments & Checkout","payments-and-checkout",[239],{"id":240,"title":241,"slug":242},260,"Badge","badge",{"slug":30,"title":29,"logo":32,"categories":244},[],{"uuid":246,"title":247,"description":248,"canonical_path":4,"image":249,"width":48,"height":206,"image_alt":250,"kind":51,"patterns":251,"component_categories":267,"app":282},"010e1797-8638-462c-9556-68a3fd83356f","Bertrand","Success modal confirming a creator's page is live, prompting them to share it via Twitter or copy the link, with celebratory confetti in the background.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F010e1797-8638-462c-9556-68a3fd83356f.png","Bertrand from Buy Me a Coffee",[252,257,262],{"id":253,"label":254,"slug":255,"rank":57,"group":256},122,"Success","success",{"id":81,"label":82,"slug":83},{"id":258,"label":259,"slug":260,"rank":59,"group":261},24,"Share","share",{"id":158,"label":160,"slug":161},{"id":263,"label":264,"slug":265,"rank":158,"group":266},17,"Publish","publish",{"id":158,"label":160,"slug":161},[268,272,276,280,281],{"id":269,"title":270,"slug":271},284,"Modal","modal",{"id":273,"title":274,"slug":275},174,"Card","card",{"id":277,"title":278,"slug":279},257,"Input number","input-number",{"id":216,"title":217,"slug":218},{"id":64,"title":65,"slug":66},{"slug":30,"title":29,"logo":32,"categories":283},[],{"uuid":285,"title":247,"description":286,"canonical_path":4,"image":287,"width":48,"height":288,"image_alt":250,"kind":51,"patterns":289,"component_categories":302,"app":307},"5570d845-6e79-4d03-8c1b-6007231ddaa8","Creator profile page where visitors can buy the creator a coffee by selecting a multiplier and leaving an optional message, while the logged-in creator sees options to edit the page and add a cover image.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F5570d845-6e79-4d03-8c1b-6007231ddaa8.png",2088,[290,295,300],{"id":291,"label":292,"slug":293,"rank":57,"group":294},130,"Checkout","checkout",{"id":235,"label":236,"slug":237},{"id":296,"label":297,"slug":298,"rank":59,"group":299},131,"Payment Form","payment-form",{"id":235,"label":236,"slug":237},{"id":147,"label":148,"slug":149,"rank":158,"group":301},{"id":151,"label":152,"slug":153},[303,304,305,306],{"id":273,"title":274,"slug":275},{"id":277,"title":278,"slug":279},{"id":216,"title":217,"slug":218},{"id":64,"title":65,"slug":66},{"slug":30,"title":29,"logo":32,"categories":308},[],[],[311,313,315,317,319,321,323,325,327,329,331,333,335,338,341,344,347,350,352,356,360,364],{"label":143,"to":312},"\u002Fexamples\u002Fscreens\u002Faccount-setup",{"label":148,"to":314},"\u002Fexamples\u002Fscreens\u002Fprofile",{"label":78,"to":316},"\u002Fexamples\u002Fscreens\u002Ferror",{"label":97,"to":318},"\u002Fexamples\u002Fscreens\u002Fsign-up",{"label":55,"to":320},"\u002Fexamples\u002Fscreens\u002Fsign-in",{"label":114,"to":322},"\u002Fexamples\u002Fscreens\u002Fverification",{"label":156,"to":324},"\u002Fexamples\u002Fscreens\u002Fadd-and-create",{"label":292,"to":326},"\u002Fexamples\u002Fscreens\u002Fcheckout",{"label":193,"to":328},"\u002Fexamples\u002Fscreens\u002Fedit",{"label":297,"to":330},"\u002Fexamples\u002Fscreens\u002Fpayment-form",{"label":232,"to":332},"\u002Fexamples\u002Fscreens\u002Fpayment-method",{"label":264,"to":334},"\u002Fexamples\u002Fscreens\u002Fpublish",{"label":336,"to":337},"Buy Me a Coffee marketing pages","\u002Fexamples\u002Fapps\u002Fbuy-me-a-coffee\u002Fmarketing",{"label":339,"to":340},"Buy Me a Coffee user flows","\u002Fexamples\u002Fapps\u002Fbuy-me-a-coffee\u002Fflows",{"label":342,"to":343},"Buy Me a Coffee UI components","\u002Fexamples\u002Fapps\u002Fbuy-me-a-coffee\u002Fcomponents",{"label":345,"to":346},"Payments app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fpayments",{"label":348,"to":349},"Crowdfunding app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fcrowdfunding",{"label":351,"to":18},"All SaaS app examples",{"label":353,"to":354,"description":355},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":357,"to":358,"description":359},"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":361,"to":362,"description":363},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":365,"to":366,"description":367},"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":369,"updated_at":370},"2022-04-10T09:33:05.000Z","2026-09-13T13:02:39.000Z"]