Skip to content

Use cases

Five screens and the icons they need

Pick a screen to see the icons it uses and where to find them.

Pick a screen

Five screens, from money to code

Each page lists the icons one screen needs.

Banking app

Accounts, cards, transfers, spending categories and security.

Banking app icons

Clinic booking app

Departments, appointments, video visits, results and records.

Clinic app icons

Checkout

Cart, delivery, payment, coupons and order status.

Checkout icons

What they share

Every screen mixes fields

Product screens need icons from several fields at once.

A clinic app needs payments. A checkout needs delivery. A dashboard needs maps. When those icons come from different sets, the line weights and corners drift. People notice.

UIX Icons draws every field on one 24 px grid in the same 15 styles. So the icons on a screen match, even when they come from different fields. The free styles cover most of what each screen needs.

FAQ

Questions

Are these use cases real customers?

No. They are example screens. They show which icons a type of product needs and how one set helps. We do not show customer stories or logos. Every icon on these pages is a real, approved icon from the library, and you can copy it from the browser in a free style.

Which icons does a mobile app need?

A mobile app usually needs a tab bar, back and close controls, search, share, notifications, profile and settings. Add icons for the app's own job, such as payments or bookings. The use cases pages show example screens with the icons each one uses, all from one set.

How do I choose icons for a new screen?

List what the user can do and what the screen shows, then give each item one plain word. Search the browser for that word. Use the picture people already know, such as a bell for alerts. Keep one style and one size across the screen.

How do I keep icons consistent across a product?

Use one set, one style and one size for each kind of place. For example, Regular at 24 px in lists and Solid for selected states. Mixing sets is what makes icons look off. Every UIX Icons style comes from one drawing, so the styles match each other.

Should icons have labels?

Add a label whenever the meaning could be unclear, and always for icons that start a risky action. Common icons such as search, close and home often work alone, but a text label is clearer. An icon-only button also needs an accessible name for screen readers.

How many icons does a dashboard need?

It depends on the product. A small dashboard may use thirty or so for navigation, filters, status and actions. Reuse the same icon for the same meaning everywhere, and keep field icons for things users must tell apart. A consistent set matters more than a large one.

Plan your own screen

Write down the icons your screen needs, then search the browser for each one.

About this page

Each use case shows one product screen: a banking app, a clinic booking app, a checkout, a logistics dashboard and a developer tool. It lists the icons that screen needs and shows them in UIX Icons. These are example screens to plan with. They are not customer stories. Every icon shown is approved.