Weekly Web Design & Development News: Collective #199

Here's the 199th 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 #199

image-compressor

A simple JavaScript image compressor. Uses the Browser's native canvas.toBlob API to do the compression work. General use this to precompress a client image file before upload it.

[Demo] [Download]

shoelace-css

A back to the basics CSS starter kit. For when you don’t need the whole boot.

[Demo] [Download]

speaking-jpg

A simple tool to hide encrypted text messages inside jpeg images.

speaking jpg embeds a comment byte marker into the jpg's meta data section, followed by the total length and a random byte series to identify the comment as speaking-jpg one. Image viewers ignore this segment when parsing the file.

[Download]

spacetime

A lightweight way to handle timezones in js

[Demo] [Download]

grabient

UI to generate linear web gradient.

[Demo] [Download]

Sky's CSS Toolkit

The Sky Digital Toolkit is the central resource for designers and developers to understand how to design and build digital products for Sky.

[Demo] [Download]

MiniBar

A lightweight, dependency-free scrollbar library written in vanilla javascript.

[Demo] [Download]

mesh

Mesh is a JavaScript code editor that feels like a spreadsheet.

[Download]

vax

Web based visual graph editor.

[Demo] [Download]

mobiledoc-kit

A toolkit for building WYSIWYG editors with Mobiledoc.

[Demo] [Download]

Random Material Palette Generator

A free tool to create random three material color palettes just with a click. Watch your palette in multiple templates, share or download your favorite palette.

[View]

Spinners & Page Loaders Pure CSS

[Demo] [Download]

Sketch Palette Generator

This plugin allows you to output a colour palette defined in JSON to Sketch.

[Download]

Animated Image Pieces

A set of experiments with an animated image pieces effect where an image gets shattered into rectangular fragments. Powered by anime.js.

[Demo] [Download]

kuhn

WordPress theme featuring CSS Grid layouts via aggressive progressive enhancement. Proof of concept to get the conversation about what CSS Grid means for WordPress themes started.

[Demo] [Download]

pokemon-font

GAME BOY font from Pokémon R/G/B/Y/G/S/C, Unicode extended.

[Demo] [Download]