Collective #496

Inspirational Website of the Week: Mirage Festival
An unconventional design with inspiring forms and shapes. Our pick this week.
Get inspired
Design popups & websites in one interface
Build Popups in the same place you build your WordPress website, so your design remains consistent and you are able to get more conversions.
See it in action
Zero Server
A zero configuration web framework that abstracts the usual project configuration for routing, bundling, and transpiling to make it easier to get started.
Check it out
Web Accessibility Guide
A curated collection of web accessibility tips, tricks, and best practices.
Check it out
How to render 3D in 2D canvas
Louis Hoebregts shows how to render a 3D shape using only the Canvas 2D API.
Read it
The CSS mental model
A series of article snippets that aims to explain CSS to JavaScript developers.
Read it
8 Little Videos About the Firefox Shape Path Editor
Mikael Ainalem demonstrates how to use the shape path editor in the DevTools of Firefox.
Read it
We Need Chrome No More
A very interesting article on how we should foster browser diversity and step away from using the browser of the world's largest advertising company.
Read it
Space Type Generator
A fascinating kinetic type generator by Kiel Mutschelknaus.
Check it out
New Math Functions for CSS
Benjamin De Cock's tweet on all the new math functions that are being added to CSS.
Check it out
CSS selectors cheatsheet
A visual CSS selectors cheatsheet made by Nana. There's also a game version of it.
Check it out
Content-based grid tracks and embracing flexibility
An article by Hidde de Vries on how content-based sizing works in a CSS Grid layout.
Read it
The Dribbble Experiment
Robert Williams analyzes the performance of a job post on Dribbble and compares it to using the advanced search tool.
Read it
FrenchKiss.js
FrenchKiss.js provides a simple and fast solution for handling internationalization.
Check it out
Our new land [SVG]
Gerard Ferrandez created this demo as part of a plottable SVG series for his AxiDraw plotter.
Check it out
Codevember 2018
A fantastic compilation of loops for Codevember 2018 including source codes and breakdown gifs. By Jaume Sanchez Elias.
Check it out
Polygon Surface
Liam Egan created this awesome demo for a Codepen challenge.
Check it out
WebGL Wonderland #5
A mesmerizing demo by Colin van Eenige.
Check it out
React-three-fiber
React-three-fiber is a small React renderer for three.js.
Check it out
Environment-based lighting and reflections in three.js and Looking Glass
Matt Hughes writes about his approach on getting real-world reflections and illumination on virtual objects.
Read it
Kiss The Sky
A beautiful evolution game by Matthew Main.
Check it out
TypeScript introduction
Get started with TypeScript with this practical introduction by Areknawo.
Read it
Subsync
Language-agnostic automatic synchronization of subtitles to video, so that subtitles are aligned to the correct starting point within the video.
Check it out
Text Trail Effect
A text trail effect for a slideshow inspired by the "Abstract is hiring" Dribbble shot.
Check it out