[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fraster\u002Fcomponents":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":48,"showcases":218,"links":219,"dates":256},"\u002Fexamples\u002Fapps\u002Fraster\u002Fcomponents","detail","components",true,{"title":9,"description":10,"og_image":11},"Raster UI components examples - Nicelydone","Browse Raster UI component design examples. Preview individual interface elements and explore related component categories. Photo manager for modern teams","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F38acc2f6-f664-496f-af24-f3fe2943f3f5.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},"Raster design examples","\u002Fexamples\u002Fapps\u002Fraster",{"label":23,"to":4},"Raster 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,"twitter_username":34,"categories":35},"Raster","raster","Photo manager for modern teams","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fraster-96602f03.png","https:\u002F\u002Fraster.app","raster_app",[36,40,44],{"id":37,"title":38,"slug":39},31,"Photography","photography",{"id":41,"title":42,"slug":43},23,"Collaboration","collaboration",{"id":45,"title":46,"slug":47},71,"File sharing","file-sharing",[49,64,79,94,109,124,136,151,166,178,188,203],{"uuid":50,"title":51,"description":52,"canonical_path":4,"image":11,"width":53,"height":54,"image_alt":55,"kind":56,"categories":57,"app":62},"c097f5f5-6ab9-4dd1-a333-fdf0df00d2c9","Appearance toggle","A segmented control for selecting the application's appearance theme, with options for System, Light, and Dark.",1001,199,"Appearance toggle from Raster","component",[58],{"id":59,"title":60,"slug":61},256,"Theme settings","theme-settings",{"slug":30,"title":29,"logo":32,"categories":63},[],{"uuid":65,"title":66,"description":67,"canonical_path":4,"image":68,"width":69,"height":70,"image_alt":71,"kind":56,"categories":72,"app":77},"56bb9448-6333-4ccf-8b78-2c17ba16637f","Workspace switcher dropdown","An open dropdown menu used to switch between organizations or workspaces, featuring the current workspace, a link to settings, and an option to add a new organization.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fc7a8db32-8993-4413-9ff6-17fbe951c060.png",487,380,"Workspace switcher dropdown from Raster",[73],{"id":74,"title":75,"slug":76},190,"Dropdown menu","dropdown-menu",{"slug":30,"title":29,"logo":32,"categories":78},[],{"uuid":80,"title":81,"description":82,"canonical_path":4,"image":83,"width":84,"height":85,"image_alt":86,"kind":56,"categories":87,"app":92},"3809311a-47f7-4def-a5b9-f991f9765a61","URL slug input","A text input field for a URL slug, preceded by a static base URL prefix.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F34485c5d-43ba-49ef-9e75-45fcf0f6e613.png",741,195,"URL slug input from Raster",[88],{"id":89,"title":90,"slug":91},201,"Input text","input-text",{"slug":30,"title":29,"logo":32,"categories":93},[],{"uuid":95,"title":96,"description":97,"canonical_path":4,"image":98,"width":99,"height":100,"image_alt":101,"kind":56,"categories":102,"app":107},"dba11fad-9e6e-482d-b85c-751e541a0935","API Key Field","A read-only input field displaying an API key, accompanied by a label and three icon buttons for copying, regenerating, and deleting the key.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fd6e3cb6c-5105-484a-b776-dc62248ba4e6.png",1148,330,"API Key Field from Raster",[103],{"id":104,"title":105,"slug":106},241,"Click to copy","click-to-copy",{"slug":30,"title":29,"logo":32,"categories":108},[],{"uuid":110,"title":111,"description":112,"canonical_path":4,"image":113,"width":114,"height":115,"image_alt":116,"kind":56,"categories":117,"app":122},"4e975368-2001-4dd3-ac66-972dbda8f7ab","Photo library card","A card displaying a 3x3 grid of photo thumbnails, with a title, photo count, and settings button below.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F8684e41f-ca5f-45fc-b5e4-ec19a46356b4.png",690,816,"Photo library card from Raster",[118],{"id":119,"title":120,"slug":121},174,"Card","card",{"slug":30,"title":29,"logo":32,"categories":123},[],{"uuid":125,"title":126,"description":127,"canonical_path":4,"image":128,"width":129,"height":130,"image_alt":131,"kind":56,"categories":132,"app":134},"cb4d11a1-c123-4a6d-8f91-2b43f6cb2ea9","Bulk Action Context Menu","A context menu overlay showing bulk actions for multiple selected images, including copying URLs, adding tags, transferring, and moving to trash.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fb80bddc6-d7e1-46eb-a7c0-11d0835d43ef.png",826,748,"Bulk Action Context Menu from Raster",[133],{"id":74,"title":75,"slug":76},{"slug":30,"title":29,"logo":32,"categories":135},[],{"uuid":137,"title":138,"description":139,"canonical_path":4,"image":140,"width":141,"height":142,"image_alt":143,"kind":56,"categories":144,"app":149},"a67a353d-7bf8-47bf-8e1c-456bf4162e06","Success Toast","A simple toast notification confirming that a description was generated successfully.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F85dab8e2-05a3-44b6-9fda-46451fbc190c.png",647,139,"Success Toast from Raster",[145],{"id":146,"title":147,"slug":148},247,"Notification Toast","notification-element",{"slug":30,"title":29,"logo":32,"categories":150},[],{"uuid":152,"title":153,"description":154,"canonical_path":4,"image":155,"width":156,"height":157,"image_alt":158,"kind":56,"categories":159,"app":164},"6f017600-8216-4332-80fb-b33fa7cce71b","Add tag input","An input field for adding tags to an image asset, featuring a tag icon and an enter key symbol.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fd4614075-fce9-4df5-a03d-41587dc2b765.png",352,217,"Add tag input from Raster",[160],{"id":161,"title":162,"slug":163},252,"Input tag","input-tag",{"slug":30,"title":29,"logo":32,"categories":165},[],{"uuid":167,"title":168,"description":169,"canonical_path":4,"image":170,"width":171,"height":172,"image_alt":173,"kind":56,"categories":174,"app":176},"92da55fd-6cfc-49c2-b321-22093952eb46","Image gallery card","A card displaying an image thumbnail with its filename, dimensions, and upload timestamp.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F191f096a-d620-449d-b79d-012c86b81714.png",688,584,"Image gallery card from Raster",[175],{"id":119,"title":120,"slug":121},{"slug":30,"title":29,"logo":32,"categories":177},[],{"uuid":179,"title":180,"description":181,"canonical_path":4,"image":182,"width":171,"height":172,"image_alt":183,"kind":56,"categories":184,"app":186},"2e4add72-51b7-4d5c-a8af-0c4337276ac8","Uploading file card","A card component displaying a file in the process of uploading. It features a large placeholder area for the image thumbnail, the filename, and a loading spinner with 'Uploading' text.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F2d715426-7ba1-46c2-8f84-52e4ea82ff3b.png","Uploading file card from Raster",[185],{"id":119,"title":120,"slug":121},{"slug":30,"title":29,"logo":32,"categories":187},[],{"uuid":189,"title":190,"description":191,"canonical_path":4,"image":192,"width":193,"height":194,"image_alt":195,"kind":56,"categories":196,"app":201},"2c26ba97-bc82-4e11-bdc8-1e84c8b1c8fe","Empty state drag and drop","An empty state message indicating no images are present, with instructions to drag and drop images to begin organizing them.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F49cd65e2-1bc0-41d9-8d10-9fd580b9b514.png",501,452,"Empty state drag and drop from Raster",[197],{"id":198,"title":199,"slug":200},278,"Illustration","illustration",{"slug":30,"title":29,"logo":32,"categories":202},[],{"uuid":204,"title":205,"description":206,"canonical_path":4,"image":207,"width":208,"height":209,"image_alt":210,"kind":56,"categories":211,"app":216},"1046012a-4fed-45c3-8db8-c91263018ee5","Sidebar navigation","A vertical sidebar navigation menu featuring a workspace switcher, primary navigation links, and a collapsible library section with nested items.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fb5f237c3-0331-43e9-a035-86b501b89abc.png",510,1673,"Sidebar navigation from Raster",[212],{"id":213,"title":214,"slug":215},209,"Vertical navigation","vertical-navigation",{"slug":30,"title":29,"logo":32,"categories":217},[],[],[220,223,226,229,232,235,238,240,244,248,252],{"label":221,"to":222},"Raster product screens","\u002Fexamples\u002Fapps\u002Fraster\u002Fscreens",{"label":224,"to":225},"Raster marketing pages","\u002Fexamples\u002Fapps\u002Fraster\u002Fmarketing",{"label":227,"to":228},"Raster user flows","\u002Fexamples\u002Fapps\u002Fraster\u002Fflows",{"label":230,"to":231},"Photography app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fphotography",{"label":233,"to":234},"Collaboration app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fcollaboration",{"label":236,"to":237},"File sharing app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Ffile-sharing",{"label":239,"to":18},"All SaaS app examples",{"label":241,"to":242,"description":243},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":245,"to":246,"description":247},"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":249,"to":250,"description":251},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":253,"to":254,"description":255},"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":257,"updated_at":258},"2024-01-29T09:44:42.000Z","2026-09-19T00:05:20.000Z"]