Collective #593
![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_markup.jpg?x86293)
The Markup
The Markup is a nonprofit newsroom that investigates how powerful institutions are using technology to change our society.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/Springboard-1.png?x86293)
![](https://www.paved.com/open/1277.gif?opens=1)
Become a Data Scientist, job guaranteed.
The Data Science Career Track is a 6-month, self-paced online course that equips students with the skills and hands-on experience to get hired in data science.
Apply today![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_tailwindUI.jpg?x86293)
Tailwind UI
Fully responsive, beautiful UI components, designed and developed by Adam Wathan and Steve Schoger, the creators of Tailwind CSS.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_peeps.jpg?x86293)
Open Peeps
A mix-and-match hand-drawn illustration library by Pablo Stanley.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_dom.jpg?x86293)
How does the Virtual DOM work?
An animated explainer by Sarah Drasner on how the Virtual DOM works.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_lazy.jpg?x86293)
Inconsistent user-experiences with native lazy-loading images
Daniel Aleksandersen highlights the differences of implementation of native lazy loading in browsers.
Read it![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_hero.jpg?x86293)
Revealing Hero Effect in CSS and JavaScript
Learn how to create a section that reveals its content when the previous element scrolls away. A tutorial by Claudia Romano.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_icons2.jpg?x86293)
Heroicons
A set of free MIT-licensed high-quality SVG icons for UI development.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_foldable.jpg?x86293)
What Does A Foldable Web Actually Mean?
A very interesting read on foldable devices and the ideas around a "foldable web". By Frederick O’Brien.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_dragdrop.jpg?x86293)
Drag–and–Drop: How to Design for Ease of Use
Learn how clear signifiers and feedback at all stages of the interaction make drag–and–drop discoverable and easy to use.
Read it![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_icons1.jpg?x86293)
Iconset
Iconset is a free SVG icon organizer and manager app for designers, developers and teams for both, macOS and Windows.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_booklet.jpg?x86293)
Booklets.io
A place that collects hundreds of booklets on design, business, freelancing and more.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_framework.jpg?x86293)
Why write vanilla JS when you can just use [insert library or framework here]?
Some good points on why writing your own vanilla JS instead of using a framework can be a better option.
Read it![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_mosquito.jpg?x86293)
Mosquito JS
A fun creation by Tim Holman: an annoying mosquito noise, generated with JavaScript.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_buttono.jpg?x86293)
Buttono
A flexible Sass mixin for creating BEM-style buttons. By Hasan Aydo?du.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_leak.jpg?x86293)
Your website probably has a memory leak
Memory leaks are common in Single Page Apps and this article will show you how to find and fix them.
Read it![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_tuner.jpg?x86293)
The Tuner
Eric Karjaluoto has a very distinct view on the role of the designer. He writes: "It's hard to produce suitable work when you think about design as a form of expression."
Read it![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_speccalc.jpg?x86293)
CSS Specificity calculator
Quickly calculate any CSS selector specificity score along with explanations.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_access.jpg?x86293)
5 Common Web App Accessibility Issues And How To Fix Them
Some useful tips on how to fix common accessibility issues in web apps.
Read it![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_grayscale.jpg?x86293)
Share images to your website using the Web Share Target API
Learn how to use the Web Share Target API on the example of a grayscale converter for images. By Michael Scharnagl.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_browser.jpg?x86293)
Pure CSS Responsive Browser Template
A really nice and responsive browser template by Adam Marsden.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_terraforming.jpg?x86293)
Animating SVG Text on a Path
A demo that shows how to animate SVG text on a path on scroll using the Intersection Observer API and SVG filters.
Check it out![Codrops Collective Item Image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/02/C593_audiobased.jpg?x86293)
Audio-based Image Distortion Effects with WebGL
Some experiments that show how to use audio-based distortion effects on images with p5.js and its sound library.
Check it out