[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Ftembo\u002Fcomponents":3},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":48,"showcases":428,"links":429,"dates":466},"\u002Fexamples\u002Fapps\u002Ftembo\u002Fcomponents","detail","components",true,{"title":9,"description":10,"og_image":11},"Tembo UI components examples - Nicelydone","Browse Tembo UI component design examples. Preview individual interface elements and explore related component categories. Move engineering work to the cloud","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fd61c4ed8-fde9-4b84-8d01-ec86d9ce237f.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},"Tembo design examples","\u002Fexamples\u002Fapps\u002Ftembo",{"label":23,"to":4},"Tembo UI components examples",{"title":23,"eyebrow":25,"description":10,"sections":26,"body":27},"SaaS app examples",[],[],{"title":29,"slug":30,"free_browse_version_uuid":31,"description":32,"logo":33,"url":34,"categories":35},"Tembo","tembo","9aeb8362-1483-4a1e-8269-1e0f3403f80c","Move engineering work to the cloud","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F7f4a2bb8-a6ed-40a9-8442-532667b5972b.png","https:\u002F\u002Fwww.tembo.io\u002F",[36,40,44],{"id":37,"title":38,"slug":39},48,"Developer Tools","developer-tools",{"id":41,"title":42,"slug":43},105,"Workflow Automation","workflow-automation",{"id":45,"title":46,"slug":47},80,"Artificial Intelligence","artificial-intelligence",[49,63,75,84,93,105,117,129,141,153,165,174,189,201,213,223,233,248,259,269,280,292,302,317,329,341,355,370,384,399,413],{"uuid":50,"title":51,"canonical_path":4,"image":11,"width":52,"height":53,"image_alt":54,"kind":55,"categories":56,"app":61},"764fcc60-194e-47a5-8a12-93b3dbd40ffd","Tembo UI component",424,407,"UI component from Tembo","component",[57],{"id":58,"title":59,"slug":60},190,"Dropdown menu","dropdown-menu",{"slug":30,"title":29,"logo":33,"categories":62},[],{"uuid":64,"title":51,"canonical_path":4,"image":65,"width":66,"height":67,"image_alt":54,"kind":55,"categories":68,"app":73},"aea725bd-9b62-462d-968b-03e64474ba4f","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F96590bb1-3c22-4194-82d5-d91a99bf8099.png",1689,1232,[69],{"id":70,"title":71,"slug":72},303,"Pricing section","pricing-section",{"slug":30,"title":29,"logo":33,"categories":74},[],{"uuid":76,"title":51,"canonical_path":4,"image":77,"width":78,"height":79,"image_alt":54,"kind":55,"categories":80,"app":82},"10d1e9c6-f5e1-4f1d-8b6f-ecd5ff62e229","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F2d996092-b6ee-4fec-bf9b-d57c7625ff2d.png",501,534,[81],{"id":58,"title":59,"slug":60},{"slug":30,"title":29,"logo":33,"categories":83},[],{"uuid":85,"title":51,"canonical_path":4,"image":86,"width":87,"height":88,"image_alt":54,"kind":55,"categories":89,"app":91},"de7ce2d7-128f-4b48-9fb0-b75d46bd69f6","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fdfa83190-f94f-4e6b-8f56-f8191fd4c339.png",685,278,[90],{"id":58,"title":59,"slug":60},{"slug":30,"title":29,"logo":33,"categories":92},[],{"uuid":94,"title":51,"canonical_path":4,"image":95,"width":96,"height":97,"image_alt":54,"kind":55,"categories":98,"app":103},"f3c7a65d-10d7-444e-9f2a-12570017167a","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F59a7d8df-dedc-4a9c-8847-7740973c4f1a.png",904,460,[99],{"id":100,"title":101,"slug":102},225,"Sorting & filtering","sorting-filtering",{"slug":30,"title":29,"logo":33,"categories":104},[],{"uuid":106,"title":51,"canonical_path":4,"image":107,"width":108,"height":109,"image_alt":54,"kind":55,"categories":110,"app":115},"babd8d3a-1894-4176-b0fb-bd36fd338301","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F54cc4857-2de7-4a51-8a28-a94039677882.png",1777,1176,[111],{"id":112,"title":113,"slug":114},302,"Empty state","emptystate",{"slug":30,"title":29,"logo":33,"categories":116},[],{"uuid":118,"title":51,"canonical_path":4,"image":119,"width":120,"height":121,"image_alt":54,"kind":55,"categories":122,"app":127},"6f5d66d1-e629-4495-bef7-9bfbceed2c87","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fbb74e561-d6e1-4bea-9034-4588bc59e693.png",558,520,[123],{"id":124,"title":125,"slug":126},213,"Progress indicator","progress-indicator",{"slug":30,"title":29,"logo":33,"categories":128},[],{"uuid":130,"title":51,"canonical_path":4,"image":131,"width":132,"height":133,"image_alt":54,"kind":55,"categories":134,"app":139},"eb805277-c7ea-4b42-85a6-ef65b40a68e6","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fa4ca56cd-0943-4586-8953-2b04da035ca8.png",1869,676,[135],{"id":136,"title":137,"slug":138},294,"Artificial intelligence","ai",{"slug":30,"title":29,"logo":33,"categories":140},[],{"uuid":142,"title":51,"canonical_path":4,"image":143,"width":144,"height":145,"image_alt":54,"kind":55,"categories":146,"app":151},"6f1da79e-4bab-4a7c-bcf8-94ddcb3b31da","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F59922f67-7f28-443d-b851-5d52d5ab6224.png",1949,880,[147],{"id":148,"title":149,"slug":150},223,"Slider","slider",{"slug":30,"title":29,"logo":33,"categories":152},[],{"uuid":154,"title":51,"canonical_path":4,"image":155,"width":156,"height":157,"image_alt":54,"kind":55,"categories":158,"app":163},"a2e0f0f9-1c4d-4bc9-9047-53274efeb149","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ff9f8cae6-9db8-4499-bec7-ca587e728fd8.png",479,1776,[159],{"id":160,"title":161,"slug":162},209,"Vertical navigation","vertical-navigation",{"slug":30,"title":29,"logo":33,"categories":164},[],{"uuid":166,"title":51,"canonical_path":4,"image":167,"width":168,"height":169,"image_alt":54,"kind":55,"categories":170,"app":172},"38b17e5e-9c87-471f-84ed-7d1157baa2cc","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fb8bc1107-f047-425c-a3ce-1fd1ea530afd.png",860,542,[171],{"id":58,"title":59,"slug":60},{"slug":30,"title":29,"logo":33,"categories":173},[],{"uuid":175,"title":176,"description":177,"canonical_path":4,"image":178,"width":179,"height":180,"image_alt":181,"kind":55,"categories":182,"app":187},"62a537e9-787e-48eb-b9d2-56f79af6c02a","Command Palette","Overlay providing quick search, navigation, and action initiation across app sections","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F165bfd4c-7565-49c4-8a5f-3ff1c38f8933.png",1350,1008,"Command Palette from Tembo",[183],{"id":184,"title":185,"slug":186},306,"Command palette","cmd-palette",{"slug":30,"title":29,"logo":33,"categories":188},[],{"uuid":190,"title":191,"description":192,"canonical_path":4,"image":193,"width":194,"height":195,"image_alt":196,"kind":55,"categories":197,"app":199},"dcd20246-56d1-4861-9a33-70dc11902cb1","Account Menu","Dropdown menu providing user profile info, account actions, and workspace switching controls","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F7fa8519e-7140-41cd-9540-5c659b4afe70.png",947,606,"Account Menu from Tembo",[198],{"id":58,"title":59,"slug":60},{"slug":30,"title":29,"logo":33,"categories":200},[],{"uuid":202,"title":203,"description":204,"canonical_path":4,"image":205,"width":206,"height":207,"image_alt":208,"kind":55,"categories":209,"app":211},"322bfc97-7589-4c6d-8186-9a9960482759","Task options menu","Configures sandbox size and reasoning model options for an AI task","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F2cc3fcc9-0e27-4343-a8b6-d87f67c0ac91.png",864,505,"Task options menu from Tembo",[210],{"id":58,"title":59,"slug":60},{"slug":30,"title":29,"logo":33,"categories":212},[],{"uuid":214,"title":215,"description":216,"canonical_path":4,"image":217,"width":132,"height":133,"image_alt":218,"kind":55,"categories":219,"app":221},"370aa83e-f048-400f-84f1-cbc032f84c04","AI Task Prompt Card","Primary input area for entering an AI coding task prompt with suggested quick actions and codebase attachment","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fad14ac81-f56c-4b81-9007-7aaaa53984df.png","AI Task Prompt Card from Tembo",[220],{"id":136,"title":137,"slug":138},{"slug":30,"title":29,"logo":33,"categories":222},[],{"uuid":224,"title":225,"description":226,"canonical_path":4,"image":227,"width":120,"height":121,"image_alt":228,"kind":55,"categories":229,"app":231},"a8daba74-3922-42fc-9605-1a4c98969459","Onboarding checklist","Shows workspace onboarding progress with checklist of setup tasks and completion status","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fc5cfd0e3-014b-41cf-a3b9-1f7492b5ec50.png","Onboarding checklist from Tembo",[230],{"id":124,"title":125,"slug":126},{"slug":30,"title":29,"logo":33,"categories":232},[],{"uuid":234,"title":235,"description":236,"canonical_path":4,"image":237,"width":238,"height":239,"image_alt":240,"kind":55,"categories":241,"app":246},"0f2b656b-8ca5-4031-9258-519bf1ca5b32","Invite User Modal","Modal dialog for sending workspace invitation via email address","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F920536a8-3247-437d-947e-2e9e19878ec6.png",1122,641,"Invite User Modal from Tembo",[242],{"id":243,"title":244,"slug":245},284,"Modal","modal",{"slug":30,"title":29,"logo":33,"categories":247},[],{"uuid":249,"title":250,"description":251,"canonical_path":4,"image":252,"width":253,"height":157,"image_alt":254,"kind":55,"categories":255,"app":257},"5d92aabf-2cf4-4c7b-a8ce-704f161b776a","Sidebar Navigation Menu","Vertical navigation menu allowing users to switch between account, administration, agent, and developer settings sections.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F7da07a06-0d7b-493a-bcfe-900fa0dee549.png",471,"Sidebar Navigation Menu from Tembo",[256],{"id":160,"title":161,"slug":162},{"slug":30,"title":29,"logo":33,"categories":258},[],{"uuid":260,"title":261,"description":262,"canonical_path":4,"image":263,"width":120,"height":121,"image_alt":264,"kind":55,"categories":265,"app":267},"38bce2c1-ef72-496f-9b6f-e2da62456648","Onboarding checklist card","Shows progress and checklist of onboarding tasks for new users on the home page","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F6dc8caa8-3240-471b-8178-4729ef186588.png","Onboarding checklist card from Tembo",[266],{"id":124,"title":125,"slug":126},{"slug":30,"title":29,"logo":33,"categories":268},[],{"uuid":270,"title":271,"description":272,"canonical_path":4,"image":273,"width":120,"height":274,"image_alt":275,"kind":55,"categories":276,"app":278},"84772996-9a19-4f94-9189-8eb9ce9cc95e","Getting started card","Shows onboarding progress with checklist of initial setup tasks for new users","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fcceb3d38-5aa6-43f2-9de3-9b39974350b2.png",1834,"Getting started card from Tembo",[277],{"id":160,"title":161,"slug":162},{"slug":30,"title":29,"logo":33,"categories":279},[],{"uuid":281,"title":282,"description":283,"canonical_path":4,"image":284,"width":285,"height":286,"image_alt":287,"kind":55,"categories":288,"app":290},"35c8a9b0-c2d2-49f7-8088-46f3f27ff705","Onboarding cards","Presents actionable onboarding steps for new users to complete setup tasks","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F70c4c1ac-e1af-45b9-bd49-170c32e65b32.png",1802,810,"Onboarding cards from Tembo",[289],{"id":148,"title":149,"slug":150},{"slug":30,"title":29,"logo":33,"categories":291},[],{"uuid":293,"title":294,"description":295,"canonical_path":4,"image":296,"width":108,"height":109,"image_alt":297,"kind":55,"categories":298,"app":300},"f35229d0-36f5-4144-aaac-20b5fbed9c15","Active Tasks Empty State","Active tasks section header with empty state illustration, message and documentation button on home page","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F04c567c0-e207-4ead-bf13-ee7298820aa2.png","Active Tasks Empty State from Tembo",[299],{"id":112,"title":113,"slug":114},{"slug":30,"title":29,"logo":33,"categories":301},[],{"uuid":303,"title":304,"description":305,"canonical_path":4,"image":306,"width":307,"height":308,"image_alt":309,"kind":55,"categories":310,"app":315},"811c722d-e650-4425-9bc1-71870784c426","Company Size Select","Lets user pick company size during workspace onboarding","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F205cc3aa-32b0-493e-8bdd-a1f5e4da1360.png",856,230,"Company Size Select from Tembo",[311],{"id":312,"title":313,"slug":314},204,"Input select","input-select",{"slug":30,"title":29,"logo":33,"categories":316},[],{"uuid":318,"title":319,"description":320,"canonical_path":4,"image":321,"width":322,"height":323,"image_alt":324,"kind":55,"categories":325,"app":327},"696fd687-c7fd-4340-9a8b-f1a3a91ca5b0","Onboarding Top Bar","Shows current workspace, onboarding progress, and contact action during workspace setup.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F2684b588-66e1-4ee9-a9e5-41c620680192.png",3024,155,"Onboarding Top Bar from Tembo",[326],{"id":124,"title":125,"slug":126},{"slug":30,"title":29,"logo":33,"categories":328},[],{"uuid":330,"title":331,"description":332,"canonical_path":4,"image":333,"width":334,"height":335,"image_alt":336,"kind":55,"categories":337,"app":339},"b1fa9187-3fc1-487e-a5a4-9fcff3411f44","Pricing Tier Cards","Displays subscription tiers with pricing, features, and CTAs for plan selection","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F7269aefc-5ba5-4e3b-a26a-8e6b0fbcad29.png",2052,1666,"Pricing Tier Cards from Tembo",[338],{"id":70,"title":71,"slug":72},{"slug":30,"title":29,"logo":33,"categories":340},[],{"uuid":342,"title":343,"description":344,"canonical_path":4,"image":345,"width":322,"height":346,"image_alt":347,"kind":55,"categories":348,"app":353},"dcc542a6-4e31-4818-a970-0270ce92bf46","Site footer","Displays grouped navigation links, legal information, copyright, and theme controls at the bottom of the marketing page.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F3feb2373-d384-43c8-b36e-d5a5624e62b0.png",1788,"Site footer from Tembo",[349],{"id":350,"title":351,"slug":352},202,"Footer","footer",{"slug":30,"title":29,"logo":33,"categories":354},[],{"uuid":356,"title":357,"description":358,"canonical_path":4,"image":359,"width":360,"height":361,"image_alt":362,"kind":55,"categories":363,"app":368},"f33049ff-6657-4010-9dc6-dd9354a8be5f","FAQ Accordion","Displays a list of frequently asked questions in an expandable accordion format on a marketing landing page","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F5aba95b7-683a-4ed7-a496-9ae9c693ca42.png",2758,1271,"FAQ Accordion from Tembo",[364],{"id":365,"title":366,"slug":367},189,"FAQ","faq",{"slug":30,"title":29,"logo":33,"categories":369},[],{"uuid":371,"title":372,"description":373,"canonical_path":4,"image":374,"width":322,"height":375,"image_alt":376,"kind":55,"categories":377,"app":382},"b72fcb27-4bb3-48bb-a3fc-4950ab4cacda","Customer Logo Row","Displays logos of companies using the product to provide social proof and credibility on a landing page.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F86bb566d-e491-406d-82cb-2e80300cf46a.png",483,"Customer Logo Row from Tembo",[378],{"id":379,"title":380,"slug":381},224,"Social proof","social-proof",{"slug":30,"title":29,"logo":33,"categories":383},[],{"uuid":385,"title":386,"description":387,"canonical_path":4,"image":388,"width":389,"height":390,"image_alt":391,"kind":55,"categories":392,"app":397},"bb131c4e-85fa-45a3-8110-b0f1aa931a46","Capabilities Bento Grid","Showcases AI coding agent workflows through interactive demo cards in a marketing grid","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ff4317c22-4749-4b74-9682-58b4ac222e33.png",2652,2774,"Capabilities Bento Grid from Tembo",[393],{"id":394,"title":395,"slug":396},298,"Bento box","bento-grid",{"slug":30,"title":29,"logo":33,"categories":398},[],{"uuid":400,"title":401,"description":402,"canonical_path":4,"image":403,"width":322,"height":404,"image_alt":405,"kind":55,"categories":406,"app":411},"ad60e740-156c-4a3f-8154-3d48265ccc75","Hero Section","Primary marketing headline and call-to-action area introducing the product value proposition with integrations and quick-start prompts.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F6e1ab567-c212-4592-a501-30c2d4b3f2c3.png",1716,"Hero Section from Tembo",[407],{"id":408,"title":409,"slug":410},197,"Hero section","hero-section",{"slug":30,"title":29,"logo":33,"categories":412},[],{"uuid":414,"title":415,"description":416,"canonical_path":4,"image":417,"width":418,"height":419,"image_alt":420,"kind":55,"categories":421,"app":426},"9cf3efe9-8317-47e5-867e-40ae7eb9ec85","Site navigation bar","Primary global navigation header providing access to main sections, sign-in, and primary CTA on the marketing landing page.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F420a65bb-7bf8-46a0-b947-e4a47e70e595.png",2760,312,"Site navigation bar from Tembo",[422],{"id":423,"title":424,"slug":425},258,"Header","header",{"slug":30,"title":29,"logo":33,"categories":427},[],[],[430,433,436,439,442,445,448,450,454,458,462],{"label":431,"to":432},"Tembo product screens","\u002Fexamples\u002Fapps\u002Ftembo\u002Fscreens",{"label":434,"to":435},"Tembo marketing pages","\u002Fexamples\u002Fapps\u002Ftembo\u002Fmarketing",{"label":437,"to":438},"Tembo user flows","\u002Fexamples\u002Fapps\u002Ftembo\u002Fflows",{"label":440,"to":441},"Developer Tools app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fdeveloper-tools",{"label":443,"to":444},"Workflow Automation app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fworkflow-automation",{"label":446,"to":447},"Artificial Intelligence app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fartificial-intelligence",{"label":449,"to":18},"All SaaS app examples",{"label":451,"to":452,"description":453},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":455,"to":456,"description":457},"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":459,"to":460,"description":461},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":463,"to":464,"description":465},"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":467,"updated_at":468},"2026-04-11T16:33:36.000Z","2026-10-05T15:29:54.000Z"]