
Icons
Design a small icon system for one product surface: toolbar actions, navigation, or status indicators. Pick a specific context and keep it tight. The goal is not a pretty icon gallery; it is a set that works at 16–24 px and still makes sense when embedded in a real UI.
Show the icons inside the interface they belong to, with labels where needed and enough spacing that the shape can be judged on its own. Include the states that matter for the chosen context: default, hover, active, selected, disabled, and any notification or unread treatment. If an icon is purely decorative, make that obvious by how it is used.
Keep the visual language consistent: stroke weight, corner radius, optical size, and filled vs outline rules should all match. If one symbol is likely to be ambiguous, solve it with a label, tooltip, or alternate treatment rather than forcing the icon to do all the work. The final screen should show that the set is recognizable, usable, and coherent in context.
Remember, simplicity is key with icons. A well-designed icon should be understandable at a glance. Try designing in a grid to maintain consistency in size and proportions across your icon set.
Better at UI design with every challenge
Select complexity and generate challenge.
Pick a platform.
Get design challenge updates in your inbox
New prompts and challenge updates. It’s free.