Collective #649

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

Inspirational Website of the Week: Wild Souls

A beautiful font pairing and saturated colors make this design really inviting. The result of a fantastic collaboration between Big Horror and No Matter.

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

Page Transitions: Creative Examples, Resources and some Tips

Dive into the world of transitions and get inspired by wonderful examples and creative ideas.

Check it out

Penpot

Penpot is the first Open Source design and prototyping platform meant for cross-domain teams.

Check it out

Managing focus in the shadow DOM

Nolan Lawson describes what JavaScript libraries for focus management would need to do to support shadow DOM.

Read it

SmolCSS

Minimal snippets for modern CSS layouts and components, created by Stephanie Eckles of ModernCSS.dev.

Check it out

Remotion

Create MP4 motion graphics in React. Leverage CSS, SVG, WebGL and more technologies to render videos programmatically with this tool.

Check it out

Understanding Z-Index in CSS

A visual guide on how z-index and stacking contexts work in CSS.

Read it

The CSS File Size and Count Report for Premier League sites

An interesting file size report of CSS used on Premier League sites. Silvestar Bistrovi?.

Check it out

github1s

One second to read GitHub code with VS Code. Just add 1s after github and press Enter in the browser address bar for any repository you want to read.

Check it out

Building a Tabs component

A foundational overview of how to build a tabs component similar to those found in iOS and Android apps.

Read it

Fitting Canvas Snow In a Tweet

Jon Kantner shows how to code up a really nice snow effect with minimal code.

Read it

Programmatically Generate Images with CSS Painting API

Viduni Wickramarachchi’s tutorial about the CSS Paining API and how to use it to generate a geometric image programmatically.

Read it

The web didn’t change; you did

A very interesting article by Remy Sharp where he explains why “the problem with developing front end projects isn’t that it’s harder or more complicated, it’s that you made it harder and more complicated”.

Read it

Only CSS: Placer Gold Rush

A beautiful CSS demo made by Yusuke Nakaya.

Check it out

Faster JavaScript calls

Victor Gomes explains how the simple idea helped improve performance of JavaScript calls.

Read it

CSS Border Font

A supercool CSS based font made by Davor Suljic using borders.

Check it out

Managing CSS Z-Index In Large Projects

Steven Frieson shares an easy-to-implement mini-framework based on existing conventions for better managing z-index in larger projects.

Read it

CSS Switch-Case Conditions

Yair Even Or explains how to emulate switch-case conditions in CSS.

Read it

How to Greatly Enhance fetch() with the Decorator Pattern

Dmitri Pavlutin writes about how to use the decorator pattern to enhance the possibilities and flexibly of the fetch() API.

Read it

Is CSS float deprecated?

Robin Rendle explains why we can pack away float and only use it for making text flow around images.

Read it

Dialy: Open source UI Kit for Figma

Dialy UI Kit is a free, open source User Interface Kit for Figma, designed and released by Aayush Gupta.

Check it out

Front-of-the-front-end and back-of-the-front-end web development

Brad Frost writes about the much-needed distinction between the types of web development that need to occur in order to build successful web things.

Read it

Accessing hardware devices on the web

François Beaufort explains how to pick the appropriate API to communicate with a hardware device of your choice.

Read it

From Our Blog
Ideas for CSS Button Hover Animations

Some inspiration for button hover animations using CSS only.

Check it out

The post Collective #649 appeared first on Codrops.