Collective #660

Original Source: http://feedproxy.google.com/~r/tympanus/~3/QSbXhSak_Hg/

Inspirational Website of the Week: Paul & Henriette

Sharp minimalism with great typography and a focus on beautiful image and layout animations. Our pick this week.

Get inspired

Our Sponsor
Instant websites for your clients with Divi Layout Packs

With the Divi Layout Packs you’ll get world-class designs ready to be used for your client projects.

Check it out

The Humble <img> Element And Core Web Vitals

An excerpt from Addy Osmani’s new book Image Optimization.

Read it

Portfolio 2021 technical case study — Rendering a whole HTML website in WebGL

Martin Laxenaire shows how he created his portfolio using his own vanilla JavaScript open source tools.

Read it

Container Queries Explainer & Proposal

Miriam Eric Suzanne explains the proposed solution for container queries and shows how to use them.

Read it

The State of CSS Cross-Browser Development

Ahmad Shadeed thoughts on why cross-browser development is better than in the past.

Read it

Mantine

Mantine is a React components and hooks library with native dark theme support and focus on usability, accessibility and developer experience.

Check it out

Two options for using custom properties

Peter-Paul Koch shares an efficient way of using custom properties for component styling.

Read it

Toggling CSS Custom Properties with Radio Buttons

Michelle Barker explains how to use custom properties for a toggle functionality.

Read it

Iconic

A fantastic set of pixel-perfect icons with new icons added every week.

Check it out

Scroll-Linked Animations with CSS Scroll-Timeline (CSS Café)

Bramus shares his talk covering Scroll-Linked Animations with CSS @scroll-timeline on CSS Café.

Check it out

Fluid Typography

Calculate CSS declarations for beautiful fluid typography headings. Made by Erik André.

Check it out

(t,i,x,y,z) => “creative code golfing”

A minimalist three-dimensional coding environment. Control 8x8x8 dots with a single JavaScript function.

Check it out

Fower

A utility-first CSS-in-JS library for rapid UI development.

Check it out

CSS Cuboid Generator

A fantastic cuboid generator made with React and Prism by Jhey.

Check it out

Profiling site speed with the Chrome DevTools Performance tab

Learn how to use the Chrome DevTools Performance tab to measure and improve the speed of your website.

Read it

3D Game Shaders For Beginners

A step-by-step guide to implementing SSAO, depth of field, lighting, normal mapping, and more for your 3D game.

Check it out

Exploring color-contrast() for the First Time

Chris Coyier explores the color-contrast() function in CSS which is freshly supported in Safari Technical Preview 122.

Read it

How to Create Actions for Selected Text With the Selection API

Preethi shows how to reveal an options panel when selecting text on a website.

Read it

Don’t Confuse Function Expressions and Function Declarations in JavaScript

What are the differences between function declarations and function expressions in JavaScript? Find out in this article by Dmitri Pavlutin.

Read it

Measuring Web Performance in 2021: The Definitive Guide

A guide to the metrics, methods, and measurements of web performance in 2021.

Check it out

From Our Blog
Dynamic CSS Masks with Custom Properties and GSAP

Learn how to animate CSS masks based on the cursor position using GSAP and custom properties for a unique spotlight effect in this article by Michelle Barker.

Read it

The post Collective #660 appeared first on Codrops.