Collective #197
Inspirational Website of the Week: Circles Conference
Vibrant colors and creative layout choices made us pick the Circles Conference website as inspiration this week.
Get inspired
Styling and scripting sliders
Peter-Paul Koch shares his experience of styling sliders for his latest project.
Read it
HotJar: All-in-one Analytics and Feedback
With already 78,000 companies on the platform and 100,000 sites running it, HotJar is becoming a popular tool for improving websites with meaningful insights.
Try it
Stereoscopic CSS
The master of 3D CSS effects, Donovan Hutchinson, goes even further with this fantastic stereoscopic cube demo.
Check it out
Flexbox Froggy
Flexbox Froggy is a brilliant game for learning how to use flexbox by helping a little frog. Made by Thomas Park.
Check it out
350 Free Icons in Google Material Style
An amazing set of 350 impeccably designed and highly useful icons from the new Nova icon set by Webalys.
Get it
Metadata markup
Jeremy Keith shows how we can combat social metadata redundancy by merging some tags.
Read it
Interactive Geographical Map with SVG and JavaScript
Learn how to add interactivity to an SVG map in this tutorial by Dudley Storey.
Check it out
Waveformer
A simple web app for visualizing audio waveforms in vector (SVG) format.
Check it out
Getting Started With CSS calc()
Ana Tudor goes beyond the usual intro to CSS calc() and shows the real power of it in this great article on Smashing Magazine.
Check it out
Awesome Interviews
A curated awesome list of lists of interview questions curated by Maxim Abramchuck.
Check it out
Jump.js
A small, modern, dependency-free smooth scrolling library by callmecavs.
Check it out
SVG Path Builder
Easily build SVG paths using this intuitive interface created by Anthony Dugois.
Check it out
Flexbox Grid Finesse
Heydon Pickering shows some very useful flexbox tricks for self-managing dynamic content.
Read it
WTF is Solid?
Solid is BuzzFeed's CSS style guide. Influenced by frameworks like Basscss, Solid uses immutable, atomic CSS classes to rapidly prototype and develop features, providing consistent styling options along with the flexibility to create new layouts and designs without the need to write additional CSS.
Check it out
Ready to use SVG icons for the web
A collection of SVG icons from around the web. Simply copy & paste the HTML code and include a basic CSS file.
Check it out
How do Promises Work?
Learn everything about promises and how they work in this beautifully illustrated guide.
Read it
Simplified JavaScript Jargon
Simplified JavaScript Jargon (short SJSJ) is a community-driven attempt to explain all those buzzwords of the current JavaScript ecosystem in a few simple words. By Hugo Giraudel.
Check it out
Must See JavaScript Dev Tools That Put Other Dev Tools to Shame
Eric Elliott shares his excitement about the rich landscape of dev tools for JavaScript.
Read it
Free Font: Butler
Butler is a free serif typeface inspired by a mix between both Dala Floda & the Bodoni family. Designed by Fabian De Smet.
Get it
Designstub
Designstub is a great place to find free, responsive and high-quality Bootstrap templates and themes.
Check it out
Building and shipping functional CSS
Cole Peters writes about successfully refactoring CSS using an atomic or functional architecture.
Read it