Weekly Web Design & Development News: Collective #216

Here's the 216th Weekly Web Design & Development Collective that aims to introduce fresh new, trendy and easy-to-use web design & development resources (freebies, codes, graphics, tools, inspiration, etc) from the past week. Have fun with it and remember to share with your friends.

Web Design & Development News: Collective #216

Geo-Maps

High Quality GeoJSON maps programmatically generated.

[Download]

QSS

The goal of QSS is to define a simple syntax for specifying element queries by adding a new ending part between a CSS selector list and the block of rules that help define the breakpoints when those rules are to apply.

[Demo] [Download]

scrollama

Scrollama is a modern & lightweight JavaScript library for scrollytelling using IntersectionObserver in favor of scroll events.

[Demo] [Download]

Before, After & More – Sliding Doors

Using clip-path to create a nice accordion-style sliding door effect. Styling elements based on sibling count. Also, it's responsive (depends on first image size).

[Demo] [Download]

instagram.css

Instagram.css - Pure CSS Instagram filters. You can add all these Instagram-like filters to your photos with using CSS only.

[Demo] [Download]

AI-Blocks

A powerful and intuitive WYSIWYG interface that allows anyone to create Machine Learning models!

[Demo] [Download]

purgecss

Purgecss is a tool inspired by Purifycss to remove unused css. Originally thought as the v2 of purifycss, purgecss has for goal to act in a similar way while correcting the known problems of purifycss.

[Download]

luxon

Luxon is a library for working with dates and times in Javascript.

• DateTime, Duration, and Interval types.
• Immutable, chainable, unambiguous API.
• Parsing and formatting for common and custom formats.
• Native time zone and Intl support (no locale or tz files).

[Demo] [Download]

Background Mouse-Position Slider

Background Mouse-Position Slider implemented in JavaScript and CSS.

[Demo] [Download]

miox

Modern Infrastructure Of Complex SPA

[Demo] [Download]

js-lingui

Seamless internationalization in Javascript and React.

[Demo] [Download]

match-sorter

Simple, expected, and deterministic best-match sorting of an array in JavaScript.

[Demo] [Download]

lottie-web

Render After Effects animations natively on Web, Android and iOS, and React Native.

[Demo] [Download]

uiw icons

The premium icon font for uiw Component Library.

[Demo] [Download]

Soapstone Typeface

The premium icon font for uiw Component Library.

[Download]