[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Framp\u002Fcomponents":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":51,"showcases":191,"links":192,"dates":229},"\u002Fexamples\u002Fapps\u002Framp\u002Fcomponents","detail","components",true,{"title":9,"description":10,"og_image":11},"Ramp UI components examples - Nicelydone","Browse Ramp UI component design examples. Preview individual interface elements and explore related component categories. The corporate card built for savings","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F0f516b9f-4fe3-4063-a908-0da5714ac63b.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},"Ramp design examples","\u002Fexamples\u002Fapps\u002Framp",{"label":23,"to":4},"Ramp UI components 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},"Ramp","ramp","The corporate card built for savings","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Framp-b0d4616e.png","https:\u002F\u002Framp.com",[35,39,43,47],{"id":36,"title":37,"slug":38},36,"Finance","finance",{"id":40,"title":41,"slug":42},39,"Payments","payments",{"id":44,"title":45,"slug":46},56,"Accounting","accounting",{"id":48,"title":49,"slug":50},80,"Artificial Intelligence","artificial-intelligence",[52,67,80,92,105,115,127,140,150,160,172,181],{"uuid":53,"title":54,"description":55,"canonical_path":4,"image":11,"width":56,"height":57,"image_alt":58,"kind":59,"categories":60,"app":65},"4236eb44-cb2c-4585-ba10-68e483ae96ea","Ramp UI component","A list of options in a form",548,531,"UI component from Ramp","component",[61],{"id":62,"title":63,"slug":64},227,"Stepper","stepper",{"slug":30,"title":29,"logo":32,"categories":66},[],{"uuid":68,"title":54,"description":69,"canonical_path":4,"image":70,"width":71,"height":72,"image_alt":58,"kind":59,"categories":73,"app":78},"f21d5bf7-8c75-490d-8370-64faf58c6d74","A modal with a list of options to select from.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fd7c6c38a-2391-40c1-a49c-de6b03028efd.png",451,1778,[74],{"id":75,"title":76,"slug":77},209,"Vertical navigation","vertical-navigation",{"slug":30,"title":29,"logo":32,"categories":79},[],{"uuid":81,"title":54,"description":82,"canonical_path":4,"image":83,"width":84,"height":72,"image_alt":58,"kind":59,"categories":85,"app":90},"c4f976b6-1d26-42ff-b1fa-92202003a5dd","A testimonial section with a quote and metrics.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fc24b696f-850c-4fcc-93bc-fcf933fb2967.png",1005,[86],{"id":87,"title":88,"slug":89},232,"Testimonial","testimonial",{"slug":30,"title":29,"logo":32,"categories":91},[],{"uuid":93,"title":54,"description":94,"canonical_path":4,"image":95,"width":96,"height":97,"image_alt":58,"kind":59,"categories":98,"app":103},"c7a08d00-5aa9-4f1b-b173-0cd3efcdafd5","A modal with a description and navigation buttons.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F01a20052-72bc-4a71-abb7-df3c996d1303.png",627,496,[99],{"id":100,"title":101,"slug":102},254,"Tooltip","tooltip-element",{"slug":30,"title":29,"logo":32,"categories":104},[],{"uuid":106,"title":54,"description":107,"canonical_path":4,"image":108,"width":109,"height":110,"image_alt":58,"kind":59,"categories":111,"app":113},"1bd5c93f-6128-4a3b-b748-6dcd84137153","A testimonial card with a ballet image","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F3af1b980-af11-4564-9f30-31604e453cbb.png",3040,1447,[112],{"id":87,"title":88,"slug":89},{"slug":30,"title":29,"logo":32,"categories":114},[],{"uuid":116,"title":54,"description":117,"canonical_path":4,"image":118,"width":109,"height":119,"image_alt":58,"kind":59,"categories":120,"app":125},"ad0e27a7-7c3a-4ef1-b1ba-30814c9f130d","A pricing page for a SaaS product.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F84bf6e61-839b-4964-9c5f-095a33a885b4.png",2146,[121],{"id":122,"title":123,"slug":124},303,"Pricing section","pricing-section",{"slug":30,"title":29,"logo":32,"categories":126},[],{"uuid":128,"title":54,"description":129,"canonical_path":4,"image":130,"width":131,"height":132,"image_alt":58,"kind":59,"categories":133,"app":138},"40b6b71f-153f-45cb-83cf-86e394ce5d05","A large number with a dollar sign and a plus sign","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fa876339d-070f-4245-9371-b2184c85931a.png",2618,737,[134],{"id":135,"title":136,"slug":137},224,"Social proof","social-proof",{"slug":30,"title":29,"logo":32,"categories":139},[],{"uuid":141,"title":54,"description":142,"canonical_path":4,"image":143,"width":144,"height":145,"image_alt":58,"kind":59,"categories":146,"app":148},"a7200b52-03df-4655-b97c-d2a15d3204a0","A landing page section showcasing statistics.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fd7ad1639-2bf5-457e-9b27-03e55323a00b.png",2807,1074,[147],{"id":135,"title":136,"slug":137},{"slug":30,"title":29,"logo":32,"categories":149},[],{"uuid":151,"title":54,"description":152,"canonical_path":4,"image":153,"width":154,"height":155,"image_alt":58,"kind":59,"categories":156,"app":158},"ab9320c4-9867-43ef-8b85-047c416b3980","A list of frequently asked questions.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fbeba7aae-365a-4a7f-b883-0c12f134a2ce.png",2880,2035,[157],{"id":87,"title":88,"slug":89},{"slug":30,"title":29,"logo":32,"categories":159},[],{"uuid":161,"title":54,"description":162,"canonical_path":4,"image":163,"width":154,"height":164,"image_alt":58,"kind":59,"categories":165,"app":170},"2b850343-0ffe-485d-8c19-24ec009c3421","A landing page showcasing procurement software features.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Faf416a2a-55b3-40cb-b06b-243bf0f7e328.png",3144,[166],{"id":167,"title":168,"slug":169},298,"Bento box","bento-grid",{"slug":30,"title":29,"logo":32,"categories":171},[],{"uuid":173,"title":54,"description":174,"canonical_path":4,"image":175,"width":154,"height":176,"image_alt":58,"kind":59,"categories":177,"app":179},"ab13dc4a-1160-404e-8996-bdda5b6be2bd","A landing page showcasing invoice processing and integration features.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F9584eaca-27d2-40a1-b71d-3ded66b2aa41.png",3112,[178],{"id":167,"title":168,"slug":169},{"slug":30,"title":29,"logo":32,"categories":180},[],{"uuid":182,"title":54,"description":183,"canonical_path":4,"image":184,"width":185,"height":186,"image_alt":58,"kind":59,"categories":187,"app":189},"da39d302-872a-4db1-9d90-ad8a12b65bd7","A quote from a finance manager about a product.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ffcb2ae56-e8ab-4a36-b4aa-a4c8043b9942.png",2043,618,[188],{"id":87,"title":88,"slug":89},{"slug":30,"title":29,"logo":32,"categories":190},[],[],[193,196,199,202,205,208,211,213,217,221,225],{"label":194,"to":195},"Ramp product screens","\u002Fexamples\u002Fapps\u002Framp\u002Fscreens",{"label":197,"to":198},"Ramp marketing pages","\u002Fexamples\u002Fapps\u002Framp\u002Fmarketing",{"label":200,"to":201},"Ramp user flows","\u002Fexamples\u002Fapps\u002Framp\u002Fflows",{"label":203,"to":204},"Finance app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Ffinance",{"label":206,"to":207},"Payments app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fpayments",{"label":209,"to":210},"Accounting app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Faccounting",{"label":212,"to":18},"All SaaS app examples",{"label":214,"to":215,"description":216},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":218,"to":219,"description":220},"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":222,"to":223,"description":224},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":226,"to":227,"description":228},"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":230,"updated_at":231},"2021-02-09T07:48:51.000Z","2026-09-13T13:02:39.000Z"]