Collective #714
Inspirational Website of the Week: Custo
Perfectly smooth animations with typography that just works. Our pick this week.
Get inspired
This content is sponsored via BuySellAds
Build websites faster with Divi Cloud
Divi Cloud is like Dropbox for your Divi websites: save something to Divi Cloud and it becomes available on all of your and your clients’ websites while you build them.
Check it out
A three.js Competition
Tiiny Host's three.js competition has started! Upload and host your web project and show off your WebGL skills!
Check it out
AutoAnimate
A zero-config, drop-in animation utility that automatically adds smooth transitions to your web app.
Check it out
Sliderland
A minimalist creative coding playground, using only HTML sliders. Make animations using math!
Check it out
IndigoStack
The native macOS app which promises to revolutionise the way you configure and run local web servers on your Mac.
Check it out
Customizing Color Fonts on the Web
WebKit now supports CSS @font-palette-values which can be used to access predefined color palettes of color fonts.
Read it
PushIn.js
In case you didn't know about it: PushIn.js is a lightweight parallax effect, built with JavaScript, that simulates an interactive dolly-in or push-in animation on a webpage.
Check it out
A calendar and weather forecast in the terminal
A couple of cool terminal tricks to get calendars and the weather, plus how to assign aliases and pass arguments to bash functions. By Jamie Smith.
Read it
Tetra
Tetra is a full stack reactive component framework for Django using Alpine.js.
Check it out
Can I Devtools?
Can I DevTools is like Can I Use but for the browser devtools. Created and curated by Pankaj Parashar.
Check it out
Top games + source code from Gamedev.js Jam 2022
The best 13 entries from the Gamedev.js Jam 2022.
Check it out
Processing Arrays non-destructively: `for-of` vs. `.reduce()` vs. `.flatMap()`
Axel Rauschmayer looks at look at three ways of processing Arrays and shows how to use the features.
Read it
Drawing with CSS: Anime Character
Alvaro Montoro explains how to draw an anime character with HTML and CSS from scratch.
Read it
Pure CSS image zoom
Some amazing CSS magic by Jhey: a thread on how to pull off a pure CSS image zoom using CSS primitives.
Check it out
Plantarium
Plantarium is an amazing tool for the procedural generation of 3D plants. Made by Max Richter.
Check it out
How I Built an "OS" with React for My Portfolio Website
Dustin Brett discusses how he made his website look and feel like an Operating System with JavaScript.
Watch it
Scroll Btween
Tween any CSS values on any DOM element in relation with its position on the viewport. No dependencies.
Check it out
The Modern JavaScript Tutorial
Freshly updated: Simple, but detailed explanations with examples and tasks, including: closures, document and events, object oriented programming and more.
Check it out
Building a static website using Iles.js
In this tutorial by Clara Ekekenta you will learn how to code a static website in Vuejs using Iles.js.
Read it
Cool CSS Hover Effects That Use Background Clipping, Masks, and 3D
Temani Afif finalizes his series on hover effects and shows how to code complex CSS hover animations.
Read it
Arctype SQL Client
Arctype is a fast and easy-to-use database client for writing queries, building dashboards, and sharing data with your team.
Check it out
State is hard: why SPAs will persist
Nolan Lawson shares some thoughts why Single-Page Apps still persist.
Read it
Star Wars Scene Transition Effects in CSS
Learn how to create those wipe transitions from Star Wars movies in CSS.
Read it
From Our Blog
Scroll Animation Ideas for Image Grids
Some ideas for scroll animations on image grids using the ScrollTrigger plugin of GSAP and the new smooth scroll library Lenis by Studio Freight.
Check it out
From Our Blog
Coding an Infinite Slider using Texture Recursion with Three.js
A coding session where you'll learn how to recreate the infinite image slider from tismes.com using Three.js.
Check it out
From Our Blog
Inspirational Websites Roundup #38
A new hand-picked selection of fresh websites for your inspiration.
Check it out