[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fillustrio":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":21,"app":34,"examples":49,"showcases":50,"links":366,"dates":401},"\u002Fexamples\u002Fapps\u002Fillustrio","detail","apps",true,{"title":9,"description":10,"og_image":11},"Illustrio design examples - Nicelydone","Explore Illustrio UI design examples. A smarter icon library","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fillustrio_sign-in_ff63a838_nicelydone.jpg",[13,16,19],{"label":14,"to":15},"Examples","\u002Fexamples",{"label":17,"to":18},"SaaS app design examples","\u002Fexamples\u002Fapps",{"label":20,"to":4},"Illustrio design examples",{"title":20,"eyebrow":22,"description":10,"sections":23,"body":33},"SaaS app examples",[24],{"title":25,"links":26},"Explore Illustrio",[27,30],{"label":28,"to":29},"product screens","\u002Fexamples\u002Fapps\u002Fillustrio\u002Fscreens",{"label":31,"to":32},"marketing pages","\u002Fexamples\u002Fapps\u002Fillustrio\u002Fmarketing",[],{"title":35,"slug":36,"description":37,"logo":38,"url":39,"categories":40},"Illustrio","illustrio","A smarter icon library","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fillustrio-be37898b.png","https:\u002F\u002Fillustrio.com",[41,45],{"id":42,"title":43,"slug":44},8,"Design","design",{"id":46,"title":47,"slug":48},30,"Productivity","productivity",[],[51,363],{"family":52,"examples":53},"screens",[54,91,113,158,191,209,232,260,289,314,339,355],{"uuid":55,"title":56,"description":57,"canonical_path":29,"image":11,"width":58,"height":59,"image_alt":60,"kind":61,"patterns":62,"component_categories":72,"app":89},"4230ed50-d272-4753-84c6-e9ce402a8410","Sign in","Sign-in screen where the user authenticates with their email and password via a modal overlay.",2880,1526,"Sign in from Illustrio","screen",[63],{"id":64,"label":65,"slug":66,"rank":67,"group":68},2,"Forgot Password","forgot-password",0,{"id":69,"label":70,"slug":71},1,"Access & Account","access-and-account",[73,77,81,85],{"id":74,"title":75,"slug":76},240,"Horizontal navigation","horizontal-navigation",{"id":78,"title":79,"slug":80},284,"Modal","modal",{"id":82,"title":83,"slug":84},233,"Tabs","tabs",{"id":86,"title":87,"slug":88},175,"Button","button",{"slug":36,"title":35,"logo":38,"categories":90},[],{"uuid":92,"title":93,"description":94,"canonical_path":29,"image":95,"width":58,"height":59,"image_alt":96,"kind":61,"patterns":97,"component_categories":103,"app":111},"97c723a7-728d-42a1-9daa-04e30360f850","Sign up","Landing page for an icon library with an active modal prompting the user to register with their email address to get started.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fillustrio_sign-up_b7caf74f_nicelydone.jpg","Sign up from Illustrio",[98],{"id":99,"label":100,"slug":101,"rank":67,"group":102},5,"Sign Up","sign-up",{"id":69,"label":70,"slug":71},[104,108,109,110],{"id":105,"title":106,"slug":107},258,"Header","header",{"id":78,"title":79,"slug":80},{"id":82,"title":83,"slug":84},{"id":86,"title":87,"slug":88},{"slug":36,"title":35,"logo":38,"categories":112},[],{"uuid":114,"title":115,"description":116,"canonical_path":29,"image":117,"width":58,"height":59,"image_alt":118,"kind":61,"patterns":119,"component_categories":148,"app":156},"84333dd7-0e65-4d7d-b074-77d963d43e8f","Home","Search results page where the user browses a grid of yellow icons and can filter them by style using a bottom tab bar.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fillustrio_home_6298272a_nicelydone.jpg","Home from Illustrio",[120,127,132,139],{"id":121,"label":122,"slug":123,"rank":67,"group":124},84,"Search Results","search-results",{"id":42,"label":125,"slug":126},"Pages & Content","pages-and-content",{"id":128,"label":129,"slug":130,"rank":69,"group":131},79,"Browse","browse",{"id":42,"label":125,"slug":126},{"id":133,"label":134,"slug":135,"rank":64,"group":136},13,"Filter & Sort","filter-and-sort",{"id":64,"label":137,"slug":138},"Actions","actions",{"id":140,"label":141,"slug":142,"rank":143,"group":144},130,"Checkout","checkout",3,{"id":145,"label":146,"slug":147},14,"Payments & Checkout","payments-and-checkout",[149,153,154,155],{"id":150,"title":151,"slug":152},260,"Badge","badge",{"id":74,"title":75,"slug":76},{"id":82,"title":83,"slug":84},{"id":86,"title":87,"slug":88},{"slug":36,"title":35,"logo":38,"categories":157},[],{"uuid":159,"title":160,"description":161,"canonical_path":29,"image":162,"width":58,"height":59,"image_alt":163,"kind":61,"patterns":164,"component_categories":184,"app":189},"3cb03574-e60d-474b-836d-e735701b2f52","Settings","Settings modal where the user updates their first name, last name, and views their email address under the profile tab.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fillustrio_settings_4e4310df_nicelydone.jpg","Settings from Illustrio",[165,172,176],{"id":143,"label":166,"slug":167,"rank":67,"group":168},"Profile","profile",{"id":169,"label":170,"slug":171},11,"Social & Collaboration","social-and-collaboration",{"id":169,"label":173,"slug":174,"rank":69,"group":175},"Edit","edit",{"id":64,"label":137,"slug":138},{"id":177,"label":178,"slug":179,"rank":64,"group":180},94,"Account Settings","account-settings",{"id":181,"label":182,"slug":183},10,"Settings & Admin","settings-and-admin",[185,186,187,188],{"id":74,"title":75,"slug":76},{"id":78,"title":79,"slug":80},{"id":82,"title":83,"slug":84},{"id":86,"title":87,"slug":88},{"slug":36,"title":35,"logo":38,"categories":190},[],{"uuid":192,"title":193,"description":194,"canonical_path":29,"image":195,"width":58,"height":59,"image_alt":196,"kind":61,"patterns":197,"component_categories":205,"app":207},"645b9a1c-c977-4a8b-a9d2-b4c4ec3b53d0","Notification","Search interface for an icon library where the user can find icons and toggle between styles like fill, stroke, and duo via a bottom bar.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fillustrio_notification_f58a22bc_nicelydone.jpg","Notification from Illustrio",[198,203],{"id":199,"label":200,"slug":201,"rank":67,"group":202},22,"Search","search",{"id":64,"label":137,"slug":138},{"id":128,"label":129,"slug":130,"rank":69,"group":204},{"id":42,"label":125,"slug":126},[206],{"id":82,"title":83,"slug":84},{"slug":36,"title":35,"logo":38,"categories":208},[],{"uuid":210,"title":211,"description":212,"canonical_path":29,"image":213,"width":58,"height":59,"image_alt":214,"kind":61,"patterns":215,"component_categories":225,"app":230},"f3cbb072-513e-4c3f-b8b7-394220d30e45","Pricing","In-app modal where the user selects between an unlimited monthly subscription, a pay-as-you-go option, or a fixed credit pack for downloading icons.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fillustrio_pricing_9953e25c_nicelydone.jpg","Pricing from Illustrio",[216,223],{"id":217,"label":211,"slug":218,"rank":67,"group":219},89,"pricing",{"id":220,"label":221,"slug":222},9,"Plans & Limits","plans-and-limits",{"id":140,"label":141,"slug":142,"rank":69,"group":224},{"id":145,"label":146,"slug":147},[226,227,228,229],{"id":74,"title":75,"slug":76},{"id":78,"title":79,"slug":80},{"id":82,"title":83,"slug":84},{"id":86,"title":87,"slug":88},{"slug":36,"title":35,"logo":38,"categories":231},[],{"uuid":233,"title":234,"description":235,"canonical_path":29,"image":236,"width":58,"height":59,"image_alt":237,"kind":61,"patterns":238,"component_categories":253,"app":258},"20d67659-ee3a-451c-ae24-cea0a5d689e1","Dropdown","Search results page where the user browses a grid of icons, filters by color palette via a dropdown, and selects icon styles like fill or stroke from a bottom toolbar.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fillustrio_dropdown_fe0727f6_nicelydone.jpg","Dropdown from Illustrio",[239,241,243,245,250],{"id":121,"label":122,"slug":123,"rank":67,"group":240},{"id":42,"label":125,"slug":126},{"id":133,"label":134,"slug":135,"rank":69,"group":242},{"id":64,"label":137,"slug":138},{"id":128,"label":129,"slug":130,"rank":64,"group":244},{"id":42,"label":125,"slug":126},{"id":246,"label":247,"slug":248,"rank":143,"group":249},23,"Select","select",{"id":64,"label":137,"slug":138},{"id":140,"label":141,"slug":142,"rank":251,"group":252},4,{"id":145,"label":146,"slug":147},[254,255,256,257],{"id":150,"title":151,"slug":152},{"id":74,"title":75,"slug":76},{"id":82,"title":83,"slug":84},{"id":86,"title":87,"slug":88},{"slug":36,"title":35,"logo":38,"categories":259},[],{"uuid":261,"title":262,"description":263,"canonical_path":29,"image":264,"width":58,"height":59,"image_alt":265,"kind":61,"patterns":266,"component_categories":284,"app":287},"0788e22f-b239-4437-9820-6d0abdd9fb2b","Single","Detail modal where the user previews an icon, switches between style variants, reviews metadata like designer and keywords, and downloads the asset in SVG or PNG format.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fillustrio_single_8225656a_nicelydone.jpg","Single from Illustrio",[267,272,277,282],{"id":268,"label":269,"slug":270,"rank":67,"group":271},82,"Media Detail","media-detail",{"id":42,"label":125,"slug":126},{"id":273,"label":274,"slug":275,"rank":69,"group":276},25,"Upload & Download","upload-and-download",{"id":64,"label":137,"slug":138},{"id":278,"label":279,"slug":280,"rank":64,"group":281},12,"Favorite","favorite",{"id":64,"label":137,"slug":138},{"id":133,"label":134,"slug":135,"rank":143,"group":283},{"id":64,"label":137,"slug":138},[285,286],{"id":78,"title":79,"slug":80},{"id":86,"title":87,"slug":88},{"slug":36,"title":35,"logo":38,"categories":288},[],{"uuid":290,"title":291,"description":292,"canonical_path":29,"image":293,"width":58,"height":59,"image_alt":294,"kind":61,"patterns":295,"component_categories":305,"app":312},"e1f88d98-7335-464e-bfa1-356189c364ce","Empty state","List view showing an empty state for the user's favorites, featuring a top navigation bar with search and a bottom toolbar for selecting icon styles.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fillustrio_empty-state_6311fd73_nicelydone.jpg","Empty state from Illustrio",[296,303],{"id":297,"label":298,"slug":299,"rank":67,"group":300},115,"Empty State","empty-state",{"id":278,"label":301,"slug":302},"States & Feedback","states-and-feedback",{"id":128,"label":129,"slug":130,"rank":69,"group":304},{"id":42,"label":125,"slug":126},[306,310,311],{"id":307,"title":308,"slug":309},174,"Card","card",{"id":82,"title":83,"slug":84},{"id":86,"title":87,"slug":88},{"slug":36,"title":35,"logo":38,"categories":313},[],{"uuid":315,"title":316,"description":317,"canonical_path":29,"image":318,"width":58,"height":59,"image_alt":319,"kind":61,"patterns":320,"component_categories":330,"app":337},"3864d5c4-342e-4380-9da7-646ce0ab3716","Create","Creation flow where the user names a new custom palette and defines its primary and secondary colors.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fillustrio_create_f09cf6ae_nicelydone.jpg","Create from Illustrio",[321,323],{"id":169,"label":173,"slug":174,"rank":67,"group":322},{"id":64,"label":137,"slug":138},{"id":324,"label":325,"slug":326,"rank":69,"group":327},58,"Media Editor","media-editor",{"id":99,"label":328,"slug":329},"Media & Tools","media-and-tools",[331,335,336],{"id":332,"title":333,"slug":334},183,"Color picker","color-picker",{"id":78,"title":79,"slug":80},{"id":86,"title":87,"slug":88},{"slug":36,"title":35,"logo":38,"categories":338},[],{"uuid":340,"title":341,"description":342,"canonical_path":29,"image":343,"width":58,"height":59,"image_alt":344,"kind":61,"patterns":345,"component_categories":348,"app":353},"2569594b-4a90-4ef3-a62f-bd1cbf1e889c","Password reset","Password recovery modal overlaid on an icon library landing page, prompting the user to enter their email address to receive a reset link.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fillustrio_password-reset_42ee54c4_nicelydone.jpg","Password reset from Illustrio",[346],{"id":64,"label":65,"slug":66,"rank":67,"group":347},{"id":69,"label":70,"slug":71},[349,350,351,352],{"id":74,"title":75,"slug":76},{"id":78,"title":79,"slug":80},{"id":82,"title":83,"slug":84},{"id":86,"title":87,"slug":88},{"slug":36,"title":35,"logo":38,"categories":354},[],{"uuid":356,"title":160,"description":357,"canonical_path":29,"image":358,"width":58,"height":59,"image_alt":163,"kind":61,"patterns":359,"component_categories":360,"app":361},"acfce97d-cbce-4643-98d8-de4c0c7db501","Account creation Onboarding Settings Form Account management Account settings Account setup","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fillustrio_settings-2_12751981_nicelydone.jpg",[],[],{"slug":36,"title":35,"logo":38,"categories":362},[],{"family":364,"examples":365},"pages",[],[367,369,371,374,377,380,383,385,389,393,397],{"label":368,"to":29},"Illustrio product screens",{"label":370,"to":32},"Illustrio marketing pages",{"label":372,"to":373},"Illustrio user flows","\u002Fexamples\u002Fapps\u002Fillustrio\u002Fflows",{"label":375,"to":376},"Illustrio UI components","\u002Fexamples\u002Fapps\u002Fillustrio\u002Fcomponents",{"label":378,"to":379},"Design app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fdesign",{"label":381,"to":382},"Productivity app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fproductivity",{"label":384,"to":18},"All SaaS app examples",{"label":386,"to":387,"description":388},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":390,"to":391,"description":392},"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":394,"to":395,"description":396},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":398,"to":399,"description":400},"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":402,"updated_at":403},"2016-12-14T08:00:00.000Z","2026-09-13T13:02:39.000Z"]