2020 is over and history. Well, may 2021 be with us. With this post I would like to continue the Discoveries, with new momentum. There was a lot to read over the holidays.
All the finds in this issue have something to do with visual aspects of web design in the broadest sense.
- Drop-Shadow: The Underrated CSS Filter
- css.gg - 700+ CSS Icons
- SVGBox - API for Web Icons
- Change Color of SVG on Hover
- CSS filter generator to convert from black to target hex color
- Responsive && Configurable SVG Waves
- How to Build a CSS-only Organizational Chart
- Brad Traversy's 50 Projects 50 Days
Drop-Shadow: The Underrated CSS Filterby Michelle Barker
There are 2 built-in ways to drop a shadow on a HTML element with CSS. Michelle shows us the difference and the additional features
filter: drop-shadow has.
css.gg - 700+ CSS Iconsby Astrit Malësia
Astrit, a swedish designer, has build this outstanding icon repository, with tons of icons in pure CSS or SVG. Chapeau…
SVGBox - API for Web Iconsby ?
In case css.gg has not the appropriate SVG icon you are looking for, visit this site and explorer 12 icon sets with over 3.000 icons. Whoever brought this to us, thanks.
Change Color of SVG on Hoverby Chris Coyier
Once again Chris, who shows us here, how to colorize a SVG icon in case you use it as a background image by using CSS filter.
CSS filter generator to convert from black to target hex colorby Barrett Sonntag
As Chris Coyer mentioned in the discovery above, you need the appropriate filter values on colorizing SVG’s. Barret has developed a converter in a pen. Useful tool…
Responsive && Configurable SVG Wavesby Jhey Tompkins
Seperating content on a web site with some kind of divider is advisable and motion is nice, if you don’t overdo it. Jhey shows us, how to combine both with an animated wave.
Balloon.cssby Claudio Holanda
Ever needed tooltips for elements, which are not self-describing? Download this pure CSS solution from Claudio und you never search again for something like that.
How to Build a CSS-only Organizational Chartby someone at Envato Tuts+
Org charts are important to visualize hierarchies. Why not creating them with nothing else than HTML and CSS?
Shiftyby Warren Galyen
Brad Traversy's 50 Projects 50 Daysby Brad Traversy
There are a lot of doing-a-thing-every-day projects, but Brad is pushing it with his 50 web projects in 50 days. Check out Expanding Cards or Rotating Navigation Animation or Theme Clock. Cool stuff and source code is available.