Closed okyr-ux closed 1 year ago
I've been thinking about that as well for next generation of API. My current plan is to allow filtering icons by:
currentColor
or has hardcoded palette)In my humble opinion, all these filter types should be prioritized and divided into separate tasks:
currentColor
, so this looks as a low-priority filter to me;stroke
, another ~20% are mixed (some figures use fill
, some use stroke
), that's why this is more high-priority;Please don't take it as arrogance 😊
Thanks. Ideas and feedback are always welcome!
Priority doesn't really matter because it is all done during same loading process in API. When icon set is loaded, checking each icon for palette, animations and other stuff doesn't take any time and extra coding.
Biggest issue is rewriting API to support it. That is part of big rewrite that I'm doing right now, which includes new API, icon picker and relies on new version of Iconify Utils and Iconify Tools. This is a big work, so it will take some time to finish.
About animations: it is actually only 2 icon sets. Big issue is lack of tools to create animations, so this is very hard to do. I'm hoping more designers look at examples of animations, see how they work, check out spec, test stuff and create more animated icons.
Added tags
property to icon set information. In future update I'll use it to sort icon sets:
Fill
tag for icon sets that use fill.Stroke
tag for icon sets that use stroke.24x24
.Icon sets that use both fill
and stroke
won't have either of those tags. Icon sets that use multiple grids, won't have grid tag. This way when user clicks tag, it guarantees that icons match that tag.
At least that's the idea for now. Tags can be used for other filters too, so it can be expanded as new filter for all icon sets instead of categories.
Added ability to filter icons by stroke/fill in new API. It is currently in development, but already stable and I'm expecting to push it to live servers sometime this month.
To filter icons by stroke/fill, search for something like home stroke=true
or home fill=true
. It doesn't check actual stroke width, only that icon uses stroke.
I'll post update here when new API servers go live.
It is live now for most visitors from Europe, will be available to other regions this weekend.
Some icon sets are designed using strokes, some are designed using fills. This is a huge difference for designers. These icons behave differently on scaling: stroke icons keep constant stroke width, or it can be easily changed. Fill icons keep the proportions on scaling. Sometimes you need one feature, sometimes another.
Examples:
It seems to be easily achieved via SVG code parsing:
fill="none" stroke="currentColor" stroke-width="2"
(stroke width can be any number)fill="currentColor"
Thank you in advance! You make an awesome job, if you need any help with this ↑ — please let me know.