[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fstrut\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":205,"links":206,"dates":240},"\u002Fexamples\u002Fapps\u002Fstrut\u002Fcomponents","detail","components",true,{"title":9,"description":10,"og_image":11},"Strut UI components examples - Nicelydone","Browse Strut UI component design examples. Preview individual interface elements and explore related component categories. The all-in-one AI workspace for…","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fb7340029-a504-4c35-992f-042b1e5bd629.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},"Strut design examples","\u002Fexamples\u002Fapps\u002Fstrut",{"label":23,"to":4},"Strut UI components examples",{"title":23,"eyebrow":25,"description":26,"sections":27,"body":28},"SaaS app examples","Browse Strut UI component design examples. Preview individual interface elements and explore related component categories. The all-in-one AI workspace for writers",[],[],{"title":30,"slug":31,"description":32,"logo":33,"url":34,"twitter_username":35,"categories":36},"Strut","strut","The all-in-one AI workspace for writers","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fstrut-ejwvr626.png","https:\u002F\u002Fstrut.so\u002F","strut_ai",[37,41],{"id":38,"title":39,"slug":40},80,"Artificial Intelligence","artificial-intelligence",{"id":42,"title":43,"slug":44},59,"Writing tools","writing-tools",[46,61,76,91,106,119,132,144,156,171,183,193],{"uuid":47,"title":48,"description":49,"canonical_path":4,"image":11,"width":50,"height":51,"image_alt":52,"kind":53,"categories":54,"app":59},"51001427-0c02-4f2b-ad11-b236f6a5fbc1","Inline creation form","A small inline form used to create a new item, featuring a text input field currently containing the text 'WIP', a dashed circle icon, and 'Create' and 'Cancel' buttons.",628,288,"Inline creation form from Strut","component",[55],{"id":56,"title":57,"slug":58},201,"Input text","input-text",{"slug":31,"title":30,"logo":33,"categories":60},[],{"uuid":62,"title":63,"description":64,"canonical_path":4,"image":65,"width":66,"height":67,"image_alt":68,"kind":53,"categories":69,"app":74},"f59a80d5-e1ec-4984-95dc-281d0de8a8e9","Template selection list","A vertical list of template options with a title and helper text. The selected option is highlighted with a white background and a checkmark icon.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F9c332779-23ed-400a-8424-85266de6c202.png",714,421,"Template selection list from Strut",[70],{"id":71,"title":72,"slug":73},204,"Input select","input-select",{"slug":31,"title":30,"logo":33,"categories":75},[],{"uuid":77,"title":78,"description":79,"canonical_path":4,"image":80,"width":81,"height":82,"image_alt":83,"kind":53,"categories":84,"app":89},"85e6181c-974c-4518-a5bb-8437e025d7c2","AI Generation State","A section showing an AI actively generating content. It includes a title, a description, a button to generate from a website, and a large text area with a floating 'Stop Writing' control indicating the AI is typing.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F746aabb6-9731-4f34-89b1-a3af0f098908.png",1856,921,"AI Generation State from Strut",[85],{"id":86,"title":87,"slug":88},294,"Artificial intelligence","ai",{"slug":31,"title":30,"logo":33,"categories":90},[],{"uuid":92,"title":93,"description":94,"canonical_path":4,"image":95,"width":96,"height":97,"image_alt":98,"kind":53,"categories":99,"app":104},"0c4e13af-e5d6-43df-8b54-f96dd30fdfa0","Strut UI component","A welcome modal with tips and tricks for a SaaS product.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fb4ce4be7-89b7-450f-95cf-1d26a8a411e4.png",1820,1760,"UI component from Strut",[100],{"id":101,"title":102,"slug":103},248,"Table","table-2",{"slug":31,"title":30,"logo":33,"categories":105},[],{"uuid":107,"title":93,"description":108,"canonical_path":4,"image":109,"width":110,"height":111,"image_alt":98,"kind":53,"categories":112,"app":117},"fc64dcf8-fab5-4926-9103-b249b4ef67c9","A modal with a list of options to change status.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F88264674-3df3-45c8-9d50-ab6621753e12.png",718,600,[113],{"id":114,"title":115,"slug":116},190,"Dropdown menu","dropdown-menu",{"slug":31,"title":30,"logo":33,"categories":118},[],{"uuid":120,"title":93,"description":121,"canonical_path":4,"image":122,"width":123,"height":124,"image_alt":98,"kind":53,"categories":125,"app":130},"67be1958-7a50-4336-9ccf-457a771c5369","A getting started guide with a list of steps.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fb4389fbc-1335-4403-a238-e42de128b8a5.png",1534,1472,[126],{"id":127,"title":128,"slug":129},286,"Vertical list","vertical-list",{"slug":31,"title":30,"logo":33,"categories":131},[],{"uuid":133,"title":134,"description":135,"canonical_path":4,"image":136,"width":137,"height":138,"image_alt":139,"kind":53,"categories":140,"app":142},"62ff4d10-b9a9-4b52-871d-a3ceeb84c165","Stage Actions Dropdown","A dropdown menu providing actions to manage a stage, including moving it up or down, and deleting it.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ff4c594f9-0817-43b6-b9e5-be8c3a6ac7c5.png",570,462,"Stage Actions Dropdown from Strut",[141],{"id":114,"title":115,"slug":116},{"slug":31,"title":30,"logo":33,"categories":143},[],{"uuid":145,"title":146,"description":147,"canonical_path":4,"image":148,"width":149,"height":150,"image_alt":151,"kind":53,"categories":152,"app":154},"4b395351-decb-4e6c-8f61-c89fa3aa2032","AI Edit Toolbar and Menu","A floating rich text formatting toolbar with an AI Edit dropdown menu. The menu is expanded, showing options like Rewrite and Adjust tone. The Adjust tone option is hovered, revealing a nested submenu with tone options like Friendly.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F7b1746f1-38f5-4038-8894-2f47ad40ce2f.png",1668,1008,"AI Edit Toolbar and Menu from Strut",[153],{"id":86,"title":87,"slug":88},{"slug":31,"title":30,"logo":33,"categories":155},[],{"uuid":157,"title":158,"description":159,"canonical_path":4,"image":160,"width":161,"height":162,"image_alt":163,"kind":53,"categories":164,"app":169},"3872b182-bc07-461d-abc1-2ea79b59aa9e","Inline AI Edit Menu","An inline text formatting toolbar with an active AI Edit dropdown menu, displayed over selected text in a document editor.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fddf9e948-0163-47d1-b3c8-3819993ef254.png",1160,887,"Inline AI Edit Menu from Strut",[165],{"id":166,"title":167,"slug":168},221,"Rich text editor","rich-text-editor",{"slug":31,"title":30,"logo":33,"categories":170},[],{"uuid":172,"title":173,"description":174,"canonical_path":4,"image":175,"width":176,"height":177,"image_alt":178,"kind":53,"categories":179,"app":181},"2df4d7d0-e4ed-46ce-aa46-5e799930cc4e","Floating text formatting toolbar","A floating toolbar that appears above selected text in a rich text editor, offering formatting options like bold, italic, headings, lists, and an AI edit menu.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F2872b096-b272-4b87-9f2f-4abad79664eb.png",1163,544,"Floating text formatting toolbar from Strut",[180],{"id":166,"title":167,"slug":168},{"slug":31,"title":30,"logo":33,"categories":182},[],{"uuid":184,"title":93,"description":185,"canonical_path":4,"image":186,"width":187,"height":188,"image_alt":98,"kind":53,"categories":189,"app":191},"feb978f5-3678-4eb8-8c92-eaf40c0ed8a2","A design tool concept with multiple features.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Faf01cf3a-e15d-45f7-8920-94b6de84360f.png",1443,1672,[190],{"id":86,"title":87,"slug":88},{"slug":31,"title":30,"logo":33,"categories":192},[],{"uuid":194,"title":195,"description":196,"canonical_path":4,"image":197,"width":198,"height":199,"image_alt":200,"kind":53,"categories":201,"app":203},"bed5b039-fa1f-4300-bdf0-ea95182e7626","AI Brainstorm Input","A text input field designed for brainstorming with an AI assistant. It features a light bulb icon, a placeholder asking what to brainstorm about, and a bottom action bar with a back button and a disabled 'Brainstorm' submit button.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F5181f495-27e8-48c3-8d01-0820fd01da5b.png",1357,418,"AI Brainstorm Input from Strut",[202],{"id":86,"title":87,"slug":88},{"slug":31,"title":30,"logo":33,"categories":204},[],[],[207,210,213,216,219,222,224,228,232,236],{"label":208,"to":209},"Strut product screens","\u002Fexamples\u002Fapps\u002Fstrut\u002Fscreens",{"label":211,"to":212},"Strut marketing pages","\u002Fexamples\u002Fapps\u002Fstrut\u002Fmarketing",{"label":214,"to":215},"Strut user flows","\u002Fexamples\u002Fapps\u002Fstrut\u002Fflows",{"label":217,"to":218},"Artificial Intelligence app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fartificial-intelligence",{"label":220,"to":221},"Writing tools app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fwriting-tools",{"label":223,"to":18},"All SaaS app examples",{"label":225,"to":226,"description":227},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":229,"to":230,"description":231},"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":233,"to":234,"description":235},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":237,"to":238,"description":239},"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":241,"updated_at":242},"2024-02-26T10:18:40.000Z","2026-09-21T00:10:05.000Z"]