Dynamic Icon Library
Dynamic Icon Library
Dynamic Icon Library
Dynamic icons are designed to be simple, modern, friendly, and quirky. They represent a paradigm shift in how we interact with technology, emphasizing the beauty in imperfection and the dynamic of the reality.
Dynamic icons are designed to be simple, modern, friendly, and quirky. They represent a paradigm shift in how we interact with technology, emphasizing the beauty in imperfection and the dynamic of the reality.
Position
Position
Position
Visual Designer
Visual Designer
Visual Designer
Tools
Tools
Tools
Adobe Illustrator
Adobe Illustrator
Adobe Illustrator
Figma
Figma
Figma
Responsibilities
Responsibilities
Responsibilities
UX/UI
UX/UI
UX/UI
System design
System design
System design
Accessibility
Accessibility
Accessibility
Timeline
Timeline
Timeline
2021 - 2022
12 months
2021 - 2022
12 months
May, 2021 - May, 2022
Overview
Overview
As a visual designer, I took care of the concept and the overall visual design, incorporating user feedback into design iterations, and keeping an eye on the icon library's implementation (into the design system) to make sure the design choices and the icons are paired correctly with the UI.
As a visual designer, I took care of the concept and the overall visual design, incorporating user feedback into design iterations, and keeping an eye on the icon library's implementation (into the design system) to make sure the design choices and the icons are paired correctly with the UI.
Challenge
Challenge
It started when I joined the team, and together with the product design leader, we conducted a reassessment of the old icon library. During this study, we discovered that the icon library had many issues and the most common one was inconsistency. All of these problems stemmed from the fact that the icon library had been built by multiple designers, and it lacked a grid system, so each designer created icons based on their particular style. Therefore, we decided that it was time to start a new library, tailored to current requirements. human touch +
It started when I joined the team, and together with the product design leader, we conducted a reassessment of the old icon library. During this study, we discovered that the icon library had many issues and the most common one was inconsistency. All of these problems stemmed from the fact that the icon library had been built by multiple designers, and it lacked a grid system, so each designer created icons based on their particular style. Therefore, we decided that it was time to start a new library, tailored to current requirements. human touch +
Guidelines
They are built on a pixel-based grid of 24px by 24px and scaled up linearly to different sizes. The grid includes a 1 px padding for the surrounding live area, and it is divided into two specially delimited parts for primary and secondary icons.
They are built on a pixel-based grid of 24px by 24px and scaled up linearly to different sizes. The grid includes a 1 px padding for the surrounding live area, and it is divided into two specially delimited parts for primary and secondary icons.
Design principles
The new icon library supports two styles: dynamic and standard. All icons are newly drawn to be pixel-perfect and modernized. They have a consistent look, ensuring readability and clarity, pairing the UI in a flawless way.
The new icon library supports two styles: dynamic and standard. All icons are newly drawn to be pixel-perfect and modernized. They have a consistent look, ensuring readability and clarity, pairing the UI in a flawless way.
Dynamic
The principles are based on asymmetry and a look that closely resembles reality. Objects and icons are subtly asymmetrical, echoing a human touch against perfection, which, in itself, is unattainable.
The principles are based on asymmetry and a look that closely resembles reality. Objects and icons are subtly asymmetrical, echoing a human touch against perfection, which, in itself, is unattainable.
Standard
Carefully crafted, with a strive for perfection, equal, and symmetrical elements give it a clear and structured design, enhancing aesthetics and creating a distinctive clarity for UI elements.
Carefully crafted, with a strive for perfection, equal, and symmetrical elements give it a clear and structured design, enhancing aesthetics and creating a distinctive clarity for UI elements.
Categories
So far, we have built up to 9 different categories in total, reaching over 250+ icons in total. Every month, we add up to 20+ new icons and update the library at the end of each month. All icons are nicely separated by frames, icon styles are clearly organized using Figma Variants.
So far, we have built up to 9 different categories in total, reaching over 250+ icons in total. Every month, we add up to 20+ new icons and update the library at the end of each month. All icons are nicely separated by frames, icon styles are clearly organized using Figma Variants.
Deliverables
Comes in all the file formats: FIG, XD, AI, Sketch, EPS, PNG and SVG. We have tried to cover all possible use cases to make working with them as easy and efficient as possible. Additionally, there is an online library that can be accessed here.
Comes in all the file formats: FIG, XD, AI, Sketch, EPS, PNG and SVG. We have tried to cover all possible use cases to make working with them as easy and efficient as possible. Additionally, there is an online library that can be accessed here.
Interested in working together? Reach out and let’s chat.
2026 © Calin Mohan
Interested in working together? Reach out and let’s chat.
2026 © Calin Mohan
Interested in working together? Reach out and let’s chat.
2026 © Calin Mohan