[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Ftines\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":222,"links":223,"dates":242},"\u002Fexamples\u002Fapps\u002Ftines\u002Fcomponents","detail","components",true,{"title":9,"description":10,"og_image":11},"Tines UI components examples - Nicelydone","Browse Tines UI component design examples. Preview individual interface elements and explore related component categories. No-code automation for security teams","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F1cb968b1-f0e1-4654-b399-c93d86866c77.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},"Tines design examples","\u002Fexamples\u002Fapps\u002Ftines",{"label":23,"to":4},"Tines 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},"Tines","tines","No-code automation for security teams","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Ftines-1ce70211.png","https:\u002F\u002Fwww.tines.com",[35,39,43,47],{"id":36,"title":37,"slug":38},78,"Security","security",{"id":40,"title":41,"slug":42},96,"No code","no-code",{"id":44,"title":45,"slug":46},80,"Artificial Intelligence","artificial-intelligence",{"id":48,"title":49,"slug":50},105,"Workflow Automation","workflow-automation",[52,67,82,97,111,126,141,156,171,183,195,207],{"uuid":53,"title":54,"description":55,"canonical_path":4,"image":11,"width":56,"height":57,"image_alt":58,"kind":59,"categories":60,"app":65},"ab9ac873-536d-4cce-8cc4-187d2dc3c03e","Avatar Customization Picker","A selection interface for customizing an avatar, featuring a row of color swatches and a grid of illustrated icons.",944,480,"Avatar Customization Picker from Tines","component",[61],{"id":62,"title":63,"slug":64},183,"Color picker","color-picker",{"slug":30,"title":29,"logo":32,"categories":66},[],{"uuid":68,"title":69,"description":70,"canonical_path":4,"image":71,"width":72,"height":73,"image_alt":74,"kind":59,"categories":75,"app":80},"23a1a0d1-00be-4d2d-8c87-4dc4721fab66","User profile dropdown menu","A dropdown menu displaying user profile options, settings, and a log out action.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fc42b3c92-22f0-424a-80c3-1369cd78bb21.png",600,815,"User profile dropdown menu from Tines",[76],{"id":77,"title":78,"slug":79},190,"Dropdown menu","dropdown-menu",{"slug":30,"title":29,"logo":32,"categories":81},[],{"uuid":83,"title":84,"description":85,"canonical_path":4,"image":86,"width":87,"height":88,"image_alt":89,"kind":59,"categories":90,"app":95},"dd24eb72-1c30-4d00-974a-c0086aa13f04","Tines UI component","A chat interface with a list of features.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F9e4c9649-4b2d-4161-9d57-2ae53070883c.png",1711,1811,"UI component from Tines",[91],{"id":92,"title":93,"slug":94},294,"Artificial intelligence","ai",{"slug":30,"title":29,"logo":32,"categories":96},[],{"uuid":98,"title":99,"description":100,"canonical_path":4,"image":101,"width":102,"height":103,"image_alt":104,"kind":59,"categories":105,"app":109},"9114349b-4e1b-41e0-87b1-c2c889dc66d7","Segmented control","A segmented control with two options: Templates and Stories. The Templates option is currently selected.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F3e5b54fc-5bde-4be0-ab47-285d8ebcadcf.png",702,192,"Segmented control from Tines",[106],{"id":107,"title":99,"slug":108},218,"segmented-control",{"slug":30,"title":29,"logo":32,"categories":110},[],{"uuid":112,"title":113,"description":114,"canonical_path":4,"image":115,"width":116,"height":117,"image_alt":118,"kind":59,"categories":119,"app":124},"88acb172-e35e-423d-88af-d6b607056cfc","Upgrade prompt card","A horizontal card prompting the user to start a free trial for full access to the Workbench feature.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fed47f574-c189-4af2-994d-aa5000223893.png",1696,396,"Upgrade prompt card from Tines",[120],{"id":121,"title":122,"slug":123},255,"Upgrade your plan","upgrade-your-plan",{"slug":30,"title":29,"logo":32,"categories":125},[],{"uuid":127,"title":128,"description":129,"canonical_path":4,"image":130,"width":131,"height":132,"image_alt":133,"kind":59,"categories":134,"app":139},"8cfb9b33-fe25-43c1-9173-b3876426a48a","Error Toast","A small, floating notification toast displaying an error message with a red exclamation icon.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fac9c0889-1c25-4076-a876-6e3e45ba2399.png",545,241,"Error Toast from Tines",[135],{"id":136,"title":137,"slug":138},247,"Notification Toast","notification-element",{"slug":30,"title":29,"logo":32,"categories":140},[],{"uuid":142,"title":143,"description":144,"canonical_path":4,"image":145,"width":146,"height":147,"image_alt":148,"kind":59,"categories":149,"app":154},"edf8b06d-caec-4da9-ad16-f302b8f413f1","Settings toggle","A toggle switch with a title and descriptive text, currently in the active state.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F817da336-f674-4160-a4c0-75a2b7606b28.png",895,267,"Settings toggle from Tines",[150],{"id":151,"title":152,"slug":153},236,"Toggle\u002FSwitch","toggle-switch",{"slug":30,"title":29,"logo":32,"categories":155},[],{"uuid":157,"title":158,"description":159,"canonical_path":4,"image":160,"width":161,"height":162,"image_alt":163,"kind":59,"categories":164,"app":169},"137a1128-6600-495f-9b8e-fc55f956613e","Settings Sidebar Navigation","A vertical sidebar navigation menu for a settings area, featuring a search bar, categorized navigation links with icons, and upgrade prompts for specific features.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fd501cb16-b438-481c-bcee-bd0ae75082ae.png",644,1875,"Settings Sidebar Navigation from Tines",[165],{"id":166,"title":167,"slug":168},209,"Vertical navigation","vertical-navigation",{"slug":30,"title":29,"logo":32,"categories":170},[],{"uuid":172,"title":173,"description":174,"canonical_path":4,"image":175,"width":176,"height":177,"image_alt":178,"kind":59,"categories":179,"app":181},"a8295e21-a14d-4639-b4db-a685e71647a6","Workspace Dropdown Menu","A dropdown menu for navigating between workspaces, teams, and settings. It includes sections for drafts, resources, team switching, and general settings.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F2d44b43f-e0a2-4ed3-b4ec-7187403bf1df.png",678,1209,"Workspace Dropdown Menu from Tines",[180],{"id":77,"title":78,"slug":79},{"slug":30,"title":29,"logo":32,"categories":182},[],{"uuid":184,"title":185,"description":186,"canonical_path":4,"image":187,"width":188,"height":189,"image_alt":190,"kind":59,"categories":191,"app":193},"6b78556a-441b-4547-a946-a5270a698e12","Node action toolbar with dropdown","A floating toolbar with primary actions like Run, Test, and Events, alongside icon buttons for export, copy, and delete. An overflow menu is open, displaying secondary actions such as Ungroup, Create template, and Rename.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F9c80b38c-e592-4a1a-beaa-abfccac2b925.png",1230,924,"Node action toolbar with dropdown from Tines",[192],{"id":77,"title":78,"slug":79},{"slug":30,"title":29,"logo":32,"categories":194},[],{"uuid":196,"title":197,"description":198,"canonical_path":4,"image":199,"width":200,"height":201,"image_alt":202,"kind":59,"categories":203,"app":205},"b58fe2ff-c3c5-4dad-934c-8153f2086392","Success Toast with Undo","A floating toast notification confirming a deletion action, featuring a success icon and an undo button.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F48abcf13-3100-458f-b13e-c24575e148eb.png",449,226,"Success Toast with Undo from Tines",[204],{"id":136,"title":137,"slug":138},{"slug":30,"title":29,"logo":32,"categories":206},[],{"uuid":208,"title":209,"description":210,"canonical_path":4,"image":211,"width":212,"height":213,"image_alt":214,"kind":59,"categories":215,"app":220},"aff28403-39e9-4a3c-8dff-38d41dec716d","Workflow node with toolbar","A selected node in a visual workflow editor, displaying an inline toolbar with actions like Run, Test, and Events. The node connects to a subsequent node below it.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F6b4eecd2-6585-48c3-8980-9b7a22aaf797.png",800,441,"Workflow node with toolbar from Tines",[216],{"id":217,"title":218,"slug":219},217,"Query builder","query-builder",{"slug":30,"title":29,"logo":32,"categories":221},[],[],[224,227,230,233,236,239],{"label":225,"to":226},"Tines product screens","\u002Fexamples\u002Fapps\u002Ftines\u002Fscreens",{"label":228,"to":229},"Tines marketing pages","\u002Fexamples\u002Fapps\u002Ftines\u002Fmarketing",{"label":231,"to":232},"Tines user flows","\u002Fexamples\u002Fapps\u002Ftines\u002Fflows",{"label":234,"to":235},"Security app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fsecurity",{"label":237,"to":238},"No code app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fno-code",{"label":240,"to":241},"Artificial Intelligence app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fartificial-intelligence",{"published_at":243,"updated_at":244},"2022-02-27T19:14:07.000Z","2026-09-13T13:02:39.000Z"]