Collective #608
Inspirational Website of the Week: 14islands
Fall in love with this amazing website of 14islands and its fantastic organic shapes and effects. Can you discove the easter egg?
Get inspiredA user's guide to CSS variables
Lea Verou's guide to help us understand the differences between declarative CSS variables and variables in other programming languages, and how you can leverage their power.
Read itSimply build visually with Divi
You've never built a WordPress website like this before. Divi is more than just a WordPress theme, it's a completely new website building platform that replaces the standard WordPress post editor with a vastly superior visual editor.
Discover DiviAudioMass
AudioMass is a free full-featured web-based audio and waveform editing tool. Find the GitHub repo here.
Check it outScrollTrigger
The new ScrollTrigger plugin by GreenSock creates amazing scroll-based animations with minimal code. You can also trigger anything scroll-related, even if it has nothing to do with animation.
Check it outFree The Docs
Instantly convert documents within Google Docs into reStructuredText. Downloads images, converts markup, bulleted lists, tables, and more.
Check it outTwin
With twin, you can use Tailwind classes within css-in-js libraries.
Check it outCUBE CSS
Learn about the CSS methodology oriented towards simplicity and consistency with a heavy dosage of pragmatism.
Read itConsoleimg
Add images to your website's developer console with this script.
Check it outGlobal and Component Style Settings with CSS Variables
Sara Soueidan explains how she uses scoped CSS variables in her own pattern library to speed up prototyping and client work.
Read itColors in CSS
Ahmad Shadeed dives into CSS colors and explains many useful details.
Read it3D First Person Art Gallery - No Javascript!
An amazing demo by Ben Evans.
Check it outFree Font: HK Grotesk Wide
HK Grotesk Wide is a free font, great for posters, headlines or book/magazine covers.
Check it outThe hamburger menu
A step by step guide to creating a hamburger menu in SVG and CSS by Mikael Ainalem.
Read itOverlapping Header with CSS Grid
A great CSS grid based solution to an overlapping layout.
Check it outColors and Fonts
Colors & Fonts is a curated library of colors and fonts for digital designers and web developers.
Check it outScrollTrigger Demo
Mariusz Dabrowski's cool demo that showcases the new ScrollTrigger plugin by GreenSock.
Check it outObject.is() vs Strict Equality Operator in JavaScript
When should you use Object.is() instead of the strict equality check in JavaScript?
Read itSemilattice
A collection of system and interaction concepts for personal knowledge management tools that reimagines how we work with and organize information. By Aosheng Ran.
Check it outFun with Fonts
Two short multiple choice quizzes on Gutenberg and font identification.
Check it outStranger Things, JavaScript Edition
Find the explanation to some of the weirdest JavaScript moments in this article.
Read itTitleRun
TitleRun is a game that lives in your title bar: jump over the obstacles to survive and reach the flag!
Check it outKinetic Typography with Three.js
Discover how to use Three.js to render kinetic typography.
Check it outUI Interactions & Animations Roundup #7
Some modern UI animation shots to keep you up-to-date with the new motion trends and get you inspired.
Check it out