
Show HN: CoreUI Icons – open-source icons with marks in SVG, Webfont and raster - mrholek
https://github.com/coreui/coreui-icons/tree/1.0.0
======
crazygringo
Not related to this specific set of icons (they look great)... but I'm
_really_ wondering when the pendulum is going to swing back from line art to
actual colors and solids again.

I've found toolbars so much harder to read for the last decade than they were
before, ever since flat design removed all color and solids and made
everything look like squiggles of the same weight.

Toolbar icons used to be much more easily distinguishable by color and shape
and weight and shading. [1] How long is the ultra-flat design trend going to
last...?!

Is it a technological issue on the web at this point? Once we get complete
browser support for color fonts [2], is that going to give us rich-color icon
fonts? Because I just cannot wait.

[1] [http://www.mswordhelp.com/wp-
content/uploads/2011/07/toolbar...](http://www.mswordhelp.com/wp-
content/uploads/2011/07/toolbar-in-word-2010.png)

[2] [https://www.colorfonts.wtf/](https://www.colorfonts.wtf/)

~~~
kitsunesoba
Something that makes color icons harder to support is the presence of dark
modes and sometimes choice of themes within light mode and dark mode. Where a
single set of glyphic icons they can simply be tinted appropriately, but with
full color icons you’ll need at minimum a base set for light mode and
secondary subset with problematic icons adjusted to work under dark mode. It’s
easy to solve from a technical perspective (in CSS there’s media queries, on
Apple OSes Xcode has built in variant handling for images) but there’s still
the extra overhead of creating the required resources.

~~~
crazygringo
That's true, but most sites don't support dark mode anyways, and it's still
not clear that dark mode will be widely adopted web designers. In any case,
you're right there would just be a second font file for dark mode, so at least
a user wouldn't have to download both.

In any case, as of two months ago Chrome still explicitly has no plans to
implement SVG in OpenType (despite support in every other major browser, and
the request being 3 years old), so color icon fonts don't appear to be coming
to the web as a whole anytime soon. :( [1]

[https://bugs.chromium.org/p/chromium/issues/detail?id=306078](https://bugs.chromium.org/p/chromium/issues/detail?id=306078)

------
Abishek_Muthian
Congratulations.

I was using similar project 'feathericons'[1] in my website, but later went on
to use just the requisite couple of svg's directly with href.

Reasons being,

1\. JS, although OP project doesn't seem to need one.

2\. Missing icons, e.g. Reddit was missing in feather icons.

3\. Only few icons were utmost needed and that doesn't justify a library.

I think the real use case for such libraries are websites were there are user
generated content and they are allowed use such icons; then again with emoji's
I don't know how many prefer this. On second thought, themes for CMS may be
the prominent use case.

[1][https://github.com/feathericons/feather](https://github.com/feathericons/feather)

~~~
mrholek
We deliver our icons with all the build tools, so you can remove unnecessary
icons and build your own set.

------
jacob019
Lovely icons, but I have been finding it so much simpler to just use unicode
characters when I need icons. I can't always find exactly what I want, but I
can usually get close enough and the simplicity is sublime.

~~~
ysavir
Agreed. [A-Za-z] are all the icons I need.

------
kerkeslager
See also: Feather Icons[1].

[1] [https://feathericons.com/](https://feathericons.com/)

------
kerkeslager
Does anybody have some font suggestions for matching this style? My ideal
would have the following:

1\. Even line thickness within each character (this matches the icon style).

2\. This is a tough one: looks good with the same line thickness at different
font sizes (i.e. if you increase font size, you decrease font weight). This
allows you to match the line thickness of your icons with the same font at
different font sizes. I'm not opposed to using a variety of fonts for
different sizes, but that of course means I have to find different fonts that
fit my criteria.

3\. Serif. This significantly improves character differentiation in my
experience. It is arguably a departure from the flat style, but sans-serif
fonts are both harder to read, and also stale IMO--too much of the internet is
Helvetica/Arial.

4\. Available on most machines. I don't necessary mean pre-loaded, but
availability from CDNs and common enough to be likely already cached would be
nice. However, given I can serve this up from a CDN or include in apps myself,
this is probably the least important criteria.

The best I've found is Zilla Slab[1]. To me that looks great in the range of
(weight:400, size: 24px) to (weight: 300, size: 40px), but smaller/larger than
that, it becomes blurry/too "spindly", respectively on my screen. That's big
enough for most applications, but for tooltips, icon labels, placeholders,
etc. I'd like a smaller size.

One consideration here is that serifs just aren't visible at smaller sizes, so
maybe I need to relax that requirement.

[1]
[https://fonts.google.com/specimen/Zilla+Slab](https://fonts.google.com/specimen/Zilla+Slab)

------
fierarul
Oh, this is just the freemium offer for the "pro" version which is $99/$39 per
user.

Wish somebody would donate to the Tango iconset for a remake and a whole load
of new icons.

------
ebg13
As someone who disables webfont downloading, I hate when fonts are used for
icons.

~~~
jessaustin
Why do you disable webfont downloading?

~~~
rozab
Why do you think Google hosts all these fonts for free? Nearly every webpage
today has a request to fonts.googleapis.com. Most adblockers don't even
blacklist it.

~~~
packetslave
Not to get in the way of a good conspiracy theory, but Google Font requests
don't include any tracking cookies.

~~~
Minor49er
You don't need cookies to track user activity across the web. If Google is
using Etags for example for handling the caching of their web fonts, and if
the user doesn't have the referer headers disabled, then Google can see who is
visiting which page and when. There are other ways to achieve this too

------
pssdbt
Good to see more variety to things like Font Awesome and Feather, nice work!

~~~
mrholek
I'm glad you like our icons. We're doing our best!

