[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fsteep\u002Fcomponents":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":29,"examples":45,"showcases":197,"links":198,"dates":232},"\u002Fexamples\u002Fapps\u002Fsteep\u002Fcomponents","detail","components",true,{"title":9,"description":10,"og_image":11},"Steep UI components examples - Nicelydone","Browse Steep UI component design examples. Preview individual interface elements and explore related component categories. The new way to work with data…","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F811f0113-3b65-4971-9334-f28de94edf5d.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},"Steep design examples","\u002Fexamples\u002Fapps\u002Fsteep",{"label":23,"to":4},"Steep UI components examples",{"title":23,"eyebrow":25,"description":26,"sections":27,"body":28},"SaaS app examples","Browse Steep UI component design examples. Preview individual interface elements and explore related component categories. The new way to work with data together",[],[],{"title":30,"slug":31,"description":32,"logo":33,"url":34,"twitter_username":35,"categories":36},"Steep","steep","The new way to work with data together","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fsteep-pou14al3.png","https:\u002F\u002Fsteep.app","steepapp",[37,41],{"id":38,"title":39,"slug":40},46,"Analytics","analytics",{"id":42,"title":43,"slug":44},57,"Big data","big-data",[46,61,74,87,100,112,125,138,151,161,174,187],{"uuid":47,"title":48,"description":49,"canonical_path":4,"image":11,"width":50,"height":51,"image_alt":52,"kind":53,"categories":54,"app":59},"99a7d1e3-909a-4fa9-b9ed-b4adf17f49eb","Steep UI component","The screenshot displays a table with data filtered by 'Net orders' and 'Country'.",2712,689,"UI component from Steep","component",[55],{"id":56,"title":57,"slug":58},248,"Table","table-2",{"slug":31,"title":30,"logo":33,"categories":60},[],{"uuid":62,"title":48,"description":63,"canonical_path":4,"image":64,"width":65,"height":66,"image_alt":52,"kind":53,"categories":67,"app":72},"0f8a7415-e446-4efd-b160-62840be9d2e7","A modal indicating data preparation for export.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ff9002f8a-f676-4d7d-bc77-64f68bfdd222.png",645,212,[68],{"id":69,"title":70,"slug":71},247,"Notification Toast","notification-element",{"slug":31,"title":30,"logo":33,"categories":73},[],{"uuid":75,"title":48,"description":76,"canonical_path":4,"image":77,"width":78,"height":79,"image_alt":52,"kind":53,"categories":80,"app":85},"f68425df-dcc0-4a05-80a9-2eaaeae29922","The screenshot shows a modal with a list of time intervals and a selection indicator.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F919e3ee0-b6e2-481b-a86d-c17b62b99d2c.png",805,576,[81],{"id":82,"title":83,"slug":84},216,"Radio button","radio-button",{"slug":31,"title":30,"logo":33,"categories":86},[],{"uuid":88,"title":48,"description":89,"canonical_path":4,"image":90,"width":91,"height":92,"image_alt":52,"kind":53,"categories":93,"app":98},"30060d68-552a-4158-83c9-c248b5dae48d","A line chart showing cancelled orders over time.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F53a91396-9d0a-43ec-9781-9ce2e55fe46b.png",2024,1242,[94],{"id":95,"title":96,"slug":97},186,"Charts","charts",{"slug":31,"title":30,"logo":33,"categories":99},[],{"uuid":101,"title":48,"description":102,"canonical_path":4,"image":103,"width":91,"height":104,"image_alt":52,"kind":53,"categories":105,"app":110},"a216adbf-3070-4885-a699-a8e79869007d","A modal window displaying a SQL query with a copy to clipboard feature.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F327f9d2f-85b8-43ed-9e8f-083d87c341ad.png",739,[106],{"id":107,"title":108,"slug":109},187,"Code block","code-block",{"slug":31,"title":30,"logo":33,"categories":111},[],{"uuid":113,"title":48,"description":114,"canonical_path":4,"image":115,"width":116,"height":117,"image_alt":52,"kind":53,"categories":118,"app":123},"1037d871-b1ce-4d4a-952e-112728b83aad","This is a filter modal.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ffe5b338b-8984-451e-9bcf-f6e0e6c5fe64.png",544,688,[119],{"id":120,"title":121,"slug":122},190,"Dropdown menu","dropdown-menu",{"slug":31,"title":30,"logo":33,"categories":124},[],{"uuid":126,"title":48,"description":127,"canonical_path":4,"image":128,"width":129,"height":130,"image_alt":52,"kind":53,"categories":131,"app":136},"a68f6a71-7ff3-42e8-81ab-d05c43800e94","The screenshot displays a modal with a search bar and a selection of icons.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F33bc4978-bfc6-4340-904b-a4a26fc5781f.png",1292,1058,[132],{"id":133,"title":134,"slug":135},183,"Color picker","color-picker",{"slug":31,"title":30,"logo":33,"categories":137},[],{"uuid":139,"title":48,"description":140,"canonical_path":4,"image":141,"width":142,"height":143,"image_alt":52,"kind":53,"categories":144,"app":149},"ffad4225-5e32-4327-9327-779de6fbacfb","The screenshot displays a filter interface with country options.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fd5d369bd-cdb4-4c34-83d1-753858cbe959.png",727,336,[145],{"id":146,"title":147,"slug":148},225,"Sorting & filtering","sorting-filtering",{"slug":31,"title":30,"logo":33,"categories":150},[],{"uuid":152,"title":48,"description":153,"canonical_path":4,"image":154,"width":155,"height":156,"image_alt":52,"kind":53,"categories":157,"app":159},"7e67a841-34f1-44f9-8199-687a39df3e18","The screenshot displays a line chart visualizing ad clicks over the last 3 months, with a popover showing the specific number of clicks for a selected date.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ff2038d23-4861-4076-b602-313568894947.png",1592,1384,[158],{"id":95,"title":96,"slug":97},{"slug":31,"title":30,"logo":33,"categories":160},[],{"uuid":162,"title":48,"description":163,"canonical_path":4,"image":164,"width":165,"height":166,"image_alt":52,"kind":53,"categories":167,"app":172},"bc8e8f53-d1db-478d-8315-f5e7ca4838d6","The image shows a date range selector with options like week, month, quarter, year, and custom range.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Feaae027d-3f0f-4bb3-a9d3-7aaa231b4724.png",1576,320,[168],{"id":169,"title":170,"slug":171},184,"Datepicker","datepicker",{"slug":31,"title":30,"logo":33,"categories":173},[],{"uuid":175,"title":48,"description":176,"canonical_path":4,"image":177,"width":178,"height":179,"image_alt":52,"kind":53,"categories":180,"app":185},"565e3d01-3c3e-45e8-a0aa-40aeedb8afdb","A modal window with chart options.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F3b865e31-f7a0-427f-aee9-55d15c983a4b.png",695,784,[181],{"id":182,"title":183,"slug":184},168,"Accordion","accordion",{"slug":31,"title":30,"logo":33,"categories":186},[],{"uuid":188,"title":48,"description":189,"canonical_path":4,"image":190,"width":191,"height":192,"image_alt":52,"kind":53,"categories":193,"app":195},"4ff44dff-9eaa-4edd-bf00-0a1de3f69bc2","A dropdown menu with options to add different types of content.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F581f951a-ac94-4107-9882-30fc6b5c6b8c.png",2192,740,[194],{"id":120,"title":121,"slug":122},{"slug":31,"title":30,"logo":33,"categories":196},[],[],[199,202,205,208,211,214,216,220,224,228],{"label":200,"to":201},"Steep product screens","\u002Fexamples\u002Fapps\u002Fsteep\u002Fscreens",{"label":203,"to":204},"Steep marketing pages","\u002Fexamples\u002Fapps\u002Fsteep\u002Fmarketing",{"label":206,"to":207},"Steep user flows","\u002Fexamples\u002Fapps\u002Fsteep\u002Fflows",{"label":209,"to":210},"Analytics app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fanalytics",{"label":212,"to":213},"Big data app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fbig-data",{"label":215,"to":18},"All SaaS app examples",{"label":217,"to":218,"description":219},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":221,"to":222,"description":223},"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":225,"to":226,"description":227},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":229,"to":230,"description":231},"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":233,"updated_at":234},"2023-11-13T11:22:16.000Z","2026-09-13T13:02:39.000Z"]