[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Ffourthwall\u002Fcomponents":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":48,"showcases":195,"links":196,"dates":215},"\u002Fexamples\u002Fapps\u002Ffourthwall\u002Fcomponents","detail","components",true,{"title":9,"description":10,"og_image":11},"Fourthwall UI components examples - Nicelydone","Browse Fourthwall UI component design examples. Preview individual interface elements and explore related component categories. Launch your brand. On your terms","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F5445a929-60e4-46e1-8e7e-c8b53ddda23e.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},"Fourthwall design examples","\u002Fexamples\u002Fapps\u002Ffourthwall",{"label":23,"to":4},"Fourthwall 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,"twitter_username":34,"categories":35},"Fourthwall","fourthwall","Launch your brand. On your terms","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F6cf581b1-c7fa-41be-a627-bf2934115d62.png","https:\u002F\u002Ffourthwall.com","FourthwallHQ",[36,40,44],{"id":37,"title":38,"slug":39},3,"Shopping","shopping",{"id":41,"title":42,"slug":43},58,"Social Commerce","social-commerce",{"id":45,"title":46,"slug":47},7,"Web Development","web-development",[49,64,74,87,97,109,122,134,147,160,172,184],{"uuid":50,"title":51,"description":52,"canonical_path":4,"image":11,"width":53,"height":54,"image_alt":55,"kind":56,"categories":57,"app":62},"80e916bb-357f-446b-9146-10a036a1c969","Fourthwall UI component","The modal recommends adding more than one 2FA method to your account.",1396,448,"UI component from Fourthwall","component",[58],{"id":59,"title":60,"slug":61},167,"Alert","alert",{"slug":30,"title":29,"logo":32,"categories":63},[],{"uuid":65,"title":51,"description":66,"canonical_path":4,"image":67,"width":68,"height":69,"image_alt":55,"kind":56,"categories":70,"app":72},"d211b4ff-55ab-4e4f-8ff8-4c767f22830a","The screenshot shows an alert message.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fdd2c789f-f6e7-4488-8e82-be9fbc85c110.png",2032,352,[71],{"id":59,"title":60,"slug":61},{"slug":30,"title":29,"logo":32,"categories":73},[],{"uuid":75,"title":51,"description":76,"canonical_path":4,"image":77,"width":78,"height":79,"image_alt":55,"kind":56,"categories":80,"app":85},"a0db25b2-132d-4eca-a281-423c9ba9930d","A line chart showing the number of free accounts over time.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F0064c5e7-2656-4e7f-8dbe-f53c6ace5cfb.png",906,1036,[81],{"id":82,"title":83,"slug":84},186,"Charts","charts",{"slug":30,"title":29,"logo":32,"categories":86},[],{"uuid":88,"title":51,"description":89,"canonical_path":4,"image":90,"width":91,"height":92,"image_alt":55,"kind":56,"categories":93,"app":95},"d07a1174-8415-4576-8870-1d98979e131e","Google analytics integration","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ffc3c320a-7051-4752-b7a6-74ca71783f63.png",2672,424,[94],{"id":59,"title":60,"slug":61},{"slug":30,"title":29,"logo":32,"categories":96},[],{"uuid":98,"title":51,"description":99,"canonical_path":4,"image":100,"width":68,"height":101,"image_alt":55,"kind":56,"categories":102,"app":107},"b5510828-6fcc-43ca-a538-e65e5206ea3a","The screenshot shows a progress bar and a list of tasks to complete, with a button to add memberships.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F282043ac-b4d0-4d3b-a24c-079f6a398a4d.png",1009,[103],{"id":104,"title":105,"slug":106},227,"Stepper","stepper",{"slug":30,"title":29,"logo":32,"categories":108},[],{"uuid":110,"title":51,"description":111,"canonical_path":4,"image":112,"width":113,"height":114,"image_alt":55,"kind":56,"categories":115,"app":120},"9eae60a2-d96e-4425-a43e-8801c2b9ec35","A message to members of a loyalty program.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F63b00f8c-8155-4ece-b147-d51921f30698.png",1376,1648,[116],{"id":117,"title":118,"slug":119},221,"Rich text editor","rich-text-editor",{"slug":30,"title":29,"logo":32,"categories":121},[],{"uuid":123,"title":51,"description":124,"canonical_path":4,"image":125,"width":68,"height":126,"image_alt":55,"kind":56,"categories":127,"app":132},"e382de57-f967-4d7e-8c5b-f997d1b51490","A modal showing a promo code has been created and providing options to copy the link or share it on social media.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fc81e75d8-db47-43fd-bbc2-b1e9838c7f3d.png",572,[128],{"id":129,"title":130,"slug":131},241,"Click to copy","click-to-copy",{"slug":30,"title":29,"logo":32,"categories":133},[],{"uuid":135,"title":51,"description":136,"canonical_path":4,"image":137,"width":138,"height":139,"image_alt":55,"kind":56,"categories":140,"app":145},"f3f91085-55a4-4eb8-ab79-07947998ee3a","The screenshot shows a modal for setting the visibility of a product or content, with options for public, hidden, and scheduled public visibility.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fdf5c2532-82dd-474a-81fa-1ef26fb25959.png",951,742,[141],{"id":142,"title":143,"slug":144},179,"Checkbox & radio","checkbox-radio",{"slug":30,"title":29,"logo":32,"categories":146},[],{"uuid":148,"title":51,"description":149,"canonical_path":4,"image":150,"width":151,"height":152,"image_alt":55,"kind":56,"categories":153,"app":158},"a1007ce5-f032-4a03-986d-4b49a6207299","A date and time picker modal.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fd2b81f33-dd0c-4462-b377-f47b559d82bd.png",1466,1453,[154],{"id":155,"title":156,"slug":157},184,"Datepicker","datepicker",{"slug":30,"title":29,"logo":32,"categories":159},[],{"uuid":161,"title":51,"description":162,"canonical_path":4,"image":163,"width":113,"height":164,"image_alt":55,"kind":56,"categories":165,"app":170},"518eee7e-ab17-4f04-bf4a-a40f67267aa9","A simple text field with a label.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F918d030b-fc80-47a5-b807-5211676c7c7c.png",368,[166],{"id":167,"title":168,"slug":169},201,"Input text","input-text",{"slug":30,"title":29,"logo":32,"categories":171},[],{"uuid":173,"title":51,"description":174,"canonical_path":4,"image":175,"width":68,"height":176,"image_alt":55,"kind":56,"categories":177,"app":182},"216d3205-8377-4403-92dd-41e3fc55e13b","The screenshot displays a modal for filtering orders based on status and sales channel.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F45a878a6-ce4e-4510-8bd0-4279230d8591.png",1285,[178],{"id":179,"title":180,"slug":181},225,"Sorting & filtering","sorting-filtering",{"slug":30,"title":29,"logo":32,"categories":183},[],{"uuid":185,"title":51,"description":186,"canonical_path":4,"image":187,"width":68,"height":176,"image_alt":55,"kind":56,"categories":188,"app":193},"dfa257f5-2fcb-4322-add2-07b045fdda0d","The screenshot displays a table of orders with columns for date, supporter, status, total, and profit.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fc6285ea0-b7f6-4eb1-a0fb-64473a1e2a1f.png",[189],{"id":190,"title":191,"slug":192},248,"Table","table-2",{"slug":30,"title":29,"logo":32,"categories":194},[],[],[197,200,203,206,209,212],{"label":198,"to":199},"Fourthwall product screens","\u002Fexamples\u002Fapps\u002Ffourthwall\u002Fscreens",{"label":201,"to":202},"Fourthwall marketing pages","\u002Fexamples\u002Fapps\u002Ffourthwall\u002Fmarketing",{"label":204,"to":205},"Fourthwall user flows","\u002Fexamples\u002Fapps\u002Ffourthwall\u002Fflows",{"label":207,"to":208},"Shopping app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fshopping",{"label":210,"to":211},"Social Commerce app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fsocial-commerce",{"label":213,"to":214},"Web Development app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fweb-development",{"published_at":216,"updated_at":217},"2025-07-07T07:47:23.000Z","2026-09-13T13:02:39.000Z"]