Collective #586
Vanilla Web Projects
Mini projects built with HTML5, CSS and JavaScript without frameworks or libraries.
Check it outA new technique for making responsive, JavaScript-free charts
Rich Harris explores how to create responsive SVG charts that work without JavaScript.
Check it outStart your own freelance business by just learning Divi
Learn how to develop websites with the most popular WordPress theme in the world and secure your success as a freelancer.
Start learning nowOld CSS, new CSS
An excellent read on how CSS looked like in the past and where we are at now.
Read itiHateRegex
Stop hating regex and start learning; iHateRegex is a very useful regex cheatsheet that also explains the commonly used expressions so that you can easily understand them.
Check it outHow I recreated a Polaroid camera with CSS gradients only
A high-level tutorial by Sarah Fossheim on how to recreate physical products with CSS only.
Read itCSS Positioning
An interactive way to learn how positioning works in CSS. By Ahmad Shadeed.
Check it outFlipping Images Horizontally or Vertically with CSS and JavaScript
Rik Schennink shows how to flip images horizontally and vertically using CSS and JavaScript.
Read itHow to Choose the Best Static Site Generator in 2020
A guide on the current top SSGs with tips for picking the right one for your project.
Read itattributes.css
A very useful Gist of the seven different types of CSS attribute selectors by Emma Bostian.
Check it outPalette Generator
Generate instant color combinations with this color schemes generator.
Check it outcoders.guide
A roadmap for learning full-stack web development using React.
Check it outSimulating dark/light colour mode
A quick tip by Christian Heilmann on how to simulate dark/light mode in the dev tools of Microsoft Edge.
Check it outAnimating Clip-Path Sections w/ Intersection Observer
A great layout by Ryan Mulligan where he uses the intersection observer API to animate each section as it scrolls in and out of the viewport.
Check it outNo-Code Coffee
A daily shot of No-Code related things sent to you every day via email or Twitter.
Check it outDisplaced box
In this live coding session, Yuri Artyukh shows how to recreate the displaced box effect seen on the Milano Digital Week site.
Watch itStyled Components vs. CSS Stylesheets
Luke Smetham weighs up the pros and cons of CSS vs. Styled Components and shares how it affects the way he write React components.
Read itMotion
An animated SVG icon editor where you can animate a pre-built set of icons. By Philip Ardeljan.
Check it outCheat Sheets Dev
Developer community built to share the most used and popular programming snippets, in a simplistic way.
Check it outNight & Day
A lovely toggle made by Steve Gardner. Here's a variation.
Check it outToggles
Super-awesome checkbox toggles made by Olivia Ng.
Check it outFlowFields
A tool that lets you create some beautiful generative art using particle simulation to visualize a field of directional vectors.
Check it out