[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fcomponents\u002Fheader":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"totals":8,"category":11,"seo":15,"breadcrumbs":19,"content":28,"examples":37,"showcases":334,"links":335,"dates":378},"\u002Fexamples\u002Fcomponents\u002Fheader","collection","components",true,{"example_count":9,"app_count":10},333,292,{"id":12,"title":13,"description":14},258,"Header","Explore how websites arrange navigation and key actions at the top of a page. Look at how the logo, menu, and account or signup controls share the header.",{"title":16,"description":17,"og_image":18},"Header UI examples - Nicelydone","Header UI design examples from SaaS apps. Explore how websites arrange navigation and key actions at the top of a page. Look at how the logo, menu, and…","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ffb03ef18-5e1a-4931-b7f0-fc55fb0dec4b.png",[20,23,26],{"label":21,"to":22},"Examples","\u002Fexamples",{"label":24,"to":25},"SaaS UI component examples","\u002Fexamples\u002Fcomponents",{"label":27,"to":4},"Header UI examples",{"title":27,"eyebrow":29,"description":30,"sections":31,"body":35},"UI component category","Header UI design examples from SaaS apps. Explore how websites arrange navigation and key actions at the top of a page. Look at how the logo, menu, and account or signup controls share the header.",[32],{"title":33,"description":14,"links":34},"About Header",[],[36],"333 UI components",[38,68,101,134,159,183,209,226,249,272,294,312],{"uuid":39,"title":40,"description":41,"canonical_path":42,"image":18,"width":43,"height":44,"image_alt":45,"kind":46,"categories":47,"app":50},"c51f9889-04d0-4c31-bf98-3e14ec76721d","Flask UI component","A dark-themed header featuring a brand logo, navigation links, and a prominent login or sign-up button.","\u002Fexamples\u002Fapps\u002Fflask\u002Fcomponents",2124,320,"UI component from Flask","component",[48],{"id":12,"title":13,"slug":49},"header",{"slug":51,"title":52,"logo":53,"baseline":54,"categories":55},"flask","Flask","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Ffb0bfd95-becd-46ec-9917-a82dd6bbe601.png","Give detailed video feedback in minutes without typing comments",[56,60,64],{"id":57,"title":58,"slug":59},100,"Video","video",{"id":61,"title":62,"slug":63},23,"Collaboration","collaboration",{"id":65,"title":66,"slug":67},35,"Feedback","feedback",{"uuid":69,"title":70,"description":71,"canonical_path":72,"image":73,"width":74,"height":75,"image_alt":76,"kind":46,"categories":77,"app":79},"7d5c198a-d764-490f-921e-630cb9944d17","Airbnb UI component","A header with global navigation and a prominent search bar for a travel and lodging platform.","\u002Fexamples\u002Fapps\u002Fairbnb\u002Fcomponents","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fa0f92741-1843-4a5c-bba7-b828437c17b1.png",3268,647,"UI component from Airbnb",[78],{"id":12,"title":13,"slug":49},{"slug":80,"title":81,"logo":82,"baseline":83,"categories":84},"airbnb","Airbnb","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fairbnb-2b8cc5d2.png","Book unique homes and experience a city like a local",[85,89,93,97],{"id":86,"title":87,"slug":88},5,"Travel","travel",{"id":90,"title":91,"slug":92},12,"Hospitality","hospitality",{"id":94,"title":95,"slug":96},17,"Peer to peer","peer-to-peer",{"id":98,"title":99,"slug":100},18,"Marketplace","marketplace",{"uuid":102,"title":103,"description":104,"canonical_path":105,"image":106,"width":107,"height":108,"image_alt":109,"kind":46,"categories":110,"app":112},"52b35328-3df8-4d22-a28c-35a957db9afb","Inference UI component","A website header featuring a brand logo, a global navigation bar, and an announcement banner for a new product version.","\u002Fexamples\u002Fapps\u002Finference\u002Fcomponents","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F419ec377-9624-430e-80ba-bdd4031b96ab.png",3024,236,"UI component from Inference",[111],{"id":12,"title":13,"slug":49},{"slug":113,"title":114,"logo":115,"baseline":116,"categories":117},"inference","Inference","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F65e2bbca-c37f-44d3-a945-dbb7846ba077.png","Build and monitor self-improving agents.",[118,122,126,130],{"id":119,"title":120,"slug":121},48,"Developer Tools","developer-tools",{"id":123,"title":124,"slug":125},16,"Monitoring","monitoring",{"id":127,"title":128,"slug":129},37,"Developer APIs","developer-apis",{"id":131,"title":132,"slug":133},80,"Artificial Intelligence","artificial-intelligence",{"uuid":135,"title":136,"description":137,"canonical_path":138,"image":139,"width":107,"height":140,"image_alt":141,"kind":46,"categories":142,"app":144},"932fcbf7-265c-4aa2-9181-1d0024445da4","Origin Financial UI component","A website header with a logo, navigation links, and call-to-action buttons, presented with a blurred background effect over a sky image.","\u002Fexamples\u002Fapps\u002Fuseorigin\u002Fcomponents","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F53145a12-b1c2-4e75-a9fb-b35297c17510.png",207,"UI component from Origin Financial",[143],{"id":12,"title":13,"slug":49},{"slug":145,"title":146,"logo":147,"baseline":148,"categories":149},"useorigin","Origin Financial","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F15075243-f5d2-4573-9045-2e4c07c4ce88.png","All-in-one financial platform for budgeting, investing, and AI-powered planning",[150,154,158],{"id":151,"title":152,"slug":153},36,"Finance","finance",{"id":155,"title":156,"slug":157},56,"Accounting","accounting",{"id":131,"title":132,"slug":133},{"uuid":160,"title":161,"description":162,"canonical_path":163,"image":164,"width":165,"height":166,"image_alt":167,"kind":46,"categories":168,"app":170},"91b30926-18aa-42dc-843f-fda7a8954f76","Steel UI component","A website header featuring an announcement bar and a navigation bar with links, a GitHub star count, and a dashboard button.","\u002Fexamples\u002Fapps\u002Fsteel\u002Fcomponents","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F6e4ca440-587a-4f3e-951a-8fef9e5e760e.png",3012,314,"UI component from Steel",[169],{"id":12,"title":13,"slug":49},{"slug":171,"title":172,"logo":173,"baseline":174,"categories":175},"steel","Steel","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F03f0fa43-a227-4dce-b66a-f340f4551973.png","Browser infrastructure for AI agents",[176,177,178,179],{"id":119,"title":120,"slug":121},{"id":131,"title":132,"slug":133},{"id":127,"title":128,"slug":129},{"id":180,"title":181,"slug":182},45,"Open Source","open-source",{"uuid":184,"title":185,"description":186,"canonical_path":187,"image":188,"width":107,"height":189,"image_alt":190,"kind":46,"categories":191,"app":193},"c4ae287b-d6b5-472b-b3d6-cfe188f385d4","Zaro UI component","A landing page for an AI transformation product featuring a hero section, navigation, and partner logos.","\u002Fexamples\u002Fapps\u002Fzaro\u002Fcomponents","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fd7ef3ef7-be62-457f-89d9-204783be3bfe.png",1959,"UI component from Zaro",[192],{"id":12,"title":13,"slug":49},{"slug":194,"title":195,"logo":196,"baseline":197,"categories":198},"zaro","Zaro","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fdcfeb606-2235-48bf-83e3-948e2ac20719.png","AI workspace with agents and apps for business automation",[199,200,201,205],{"id":61,"title":62,"slug":63},{"id":131,"title":132,"slug":133},{"id":202,"title":203,"slug":204},22,"Knowledge Management","knowledge-management",{"id":206,"title":207,"slug":208},46,"Analytics","analytics",{"uuid":210,"title":211,"description":212,"canonical_path":213,"image":214,"width":165,"height":215,"image_alt":216,"kind":46,"categories":217,"app":219},"84142a27-ed5b-4f7f-8ea4-a21cd7567a66","Riverside UI component","A website header with global navigation and calls to action.","\u002Fexamples\u002Fapps\u002Friverside\u002Fcomponents","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fbc209c1d-79fe-42e6-a7c6-4666c3f66b1e.png",134,"UI component from Riverside",[218],{"id":12,"title":13,"slug":49},{"slug":220,"title":221,"logo":222,"baseline":223,"categories":224},"riverside","Riverside","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fcc94468d-7b59-49b7-b969-3aee258a2348.png","HD podcast and video recording and editing software",[225],{"id":57,"title":58,"slug":59},{"uuid":227,"title":228,"description":229,"canonical_path":230,"image":231,"width":107,"height":232,"image_alt":233,"kind":46,"categories":234,"app":236},"5621bcff-4130-47d3-a376-801f00ce7aa2","Axiom UI component","A website header displaying a brand logo, primary navigation links, a sign-in option, and a call-to-action button.","\u002Fexamples\u002Fapps\u002Faxiom\u002Fcomponents","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F78121b38-7ad2-4493-8efe-94f2ef294af5.png",133,"UI component from Axiom",[235],{"id":12,"title":13,"slug":49},{"slug":237,"title":238,"logo":239,"baseline":240,"categories":241},"axiom","Axiom","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F22cc0be3-ce3f-442a-903f-4da9befc54cd.png","The modern machine data platform.",[242,243,247,248],{"id":206,"title":207,"slug":208},{"id":244,"title":245,"slug":246},57,"Big data","big-data",{"id":123,"title":124,"slug":125},{"id":119,"title":120,"slug":121},{"uuid":250,"title":251,"description":252,"canonical_path":253,"image":254,"width":107,"height":255,"image_alt":256,"kind":46,"categories":257,"app":259},"b106b741-ba15-4693-90c4-911e6f8b54bc","Extend UI component","A website header featuring a company logo, global navigation links, and a call-to-action button.","\u002Fexamples\u002Fapps\u002Fextend\u002Fcomponents","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fe5f7833d-0f24-4edf-b510-dabc29b69c54.png",108,"UI component from Extend",[258],{"id":12,"title":13,"slug":49},{"slug":260,"title":261,"logo":262,"baseline":263,"categories":264},"extend","Extend","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F15f6030e-2d0f-4381-9480-44902ed125e2.png","Document processing infrastructure for AI agents",[265,269,270,271],{"id":266,"title":267,"slug":268},77,"Machine learning","machine-learning",{"id":131,"title":132,"slug":133},{"id":127,"title":128,"slug":129},{"id":119,"title":120,"slug":121},{"uuid":273,"title":274,"description":275,"canonical_path":276,"image":277,"width":278,"height":44,"image_alt":279,"kind":46,"categories":280,"app":282},"1946a4c3-89bb-4b03-899b-7cfec00074a5","Lithic UI component","A website header featuring a logo, primary navigation links, a contact link, and a dashboard button.","\u002Fexamples\u002Fapps\u002Flithic\u002Fcomponents","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fd5d2c672-7b5f-4caa-9faf-4d5e40d7974a.png",2816,"UI component from Lithic",[281],{"id":12,"title":13,"slug":49},{"slug":283,"title":284,"logo":285,"baseline":286,"categories":287},"lithic","Lithic","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F29eef334-64df-456e-bb65-9d93c535b644.png","Programmable card issuing and money movement platform",[288,289,293],{"id":151,"title":152,"slug":153},{"id":290,"title":291,"slug":292},39,"Payments","payments",{"id":127,"title":128,"slug":129},{"uuid":295,"title":296,"description":297,"canonical_path":298,"image":299,"width":300,"height":301,"image_alt":302,"kind":46,"categories":303,"app":305},"3a459b58-7ea1-4ad8-8ce1-fe8077c10656","Visitors UI component","A horizontal navigation bar with a logo, menu items, and call-to-action buttons.","\u002Fexamples\u002Fapps\u002Fvisitors\u002Fcomponents","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F15ea2f41-aadf-40ea-80c3-412c9e34b443.png",1180,365,"UI component from Visitors",[304],{"id":12,"title":13,"slug":49},{"slug":306,"title":307,"logo":308,"baseline":309,"categories":310},"visitors","Visitors","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fba53672a-9799-4a87-8187-a0b0c0766b64.png","Revenue-first web analytics",[311],{"id":206,"title":207,"slug":208},{"uuid":313,"title":314,"description":315,"canonical_path":316,"image":317,"width":318,"height":319,"image_alt":320,"kind":46,"categories":321,"app":323},"847c34cd-c786-4ceb-93a7-e2da307c0721","Dock UI component","A website header featuring a brand logo, primary navigation links, and call-to-action buttons.","\u002Fexamples\u002Fapps\u002Fdock\u002Fcomponents","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fd74ae4c6-222c-48ab-8074-7da63247a05a.png",3152,330,"UI component from Dock",[322],{"id":12,"title":13,"slug":49},{"slug":324,"title":325,"logo":326,"baseline":327,"categories":328},"dock","Dock","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fdock-k4tgvy1y.png","The new way to manage external relationships",[329,330],{"id":61,"title":62,"slug":63},{"id":331,"title":332,"slug":333},29,"Task Management","task-management",[],[336,339,342,345,348,351,354,357,360,363,366,369,372,375],{"label":337,"to":338},"Landing Page","\u002Fexamples\u002Fpages\u002Flanding-page",{"label":340,"to":341},"Developer Portal","\u002Fexamples\u002Fpages\u002Fdeveloper-portal",{"label":343,"to":344},"Flask design examples","\u002Fexamples\u002Fapps\u002Fflask",{"label":346,"to":347},"Airbnb design examples","\u002Fexamples\u002Fapps\u002Fairbnb",{"label":349,"to":350},"Inference design examples","\u002Fexamples\u002Fapps\u002Finference",{"label":352,"to":353},"Origin Financial design examples","\u002Fexamples\u002Fapps\u002Fuseorigin",{"label":355,"to":356},"Steel design examples","\u002Fexamples\u002Fapps\u002Fsteel",{"label":358,"to":359},"Zaro design examples","\u002Fexamples\u002Fapps\u002Fzaro",{"label":361,"to":362},"Riverside design examples","\u002Fexamples\u002Fapps\u002Friverside",{"label":364,"to":365},"Axiom design examples","\u002Fexamples\u002Fapps\u002Faxiom",{"label":367,"to":368},"Extend design examples","\u002Fexamples\u002Fapps\u002Fextend",{"label":370,"to":371},"Lithic design examples","\u002Fexamples\u002Fapps\u002Flithic",{"label":373,"to":374},"Visitors design examples","\u002Fexamples\u002Fapps\u002Fvisitors",{"label":376,"to":377},"Dock design examples","\u002Fexamples\u002Fapps\u002Fdock",{"published_at":379,"updated_at":380},"2022-08-24T17:31:33.000Z","2026-09-17T10:44:16.000Z"]