beauhaus / Nightscape-II

Experimental use of SVG filters with CSS to render clouds (CSS-Tricks Article). Sample with replacement used to randomize highway traffic in the foreground.

Home Page:https://codepen.io/beauhaus/full/OaRwbm

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Nightscape II

Experiemental use of box-shadow filtered through <SVG's> fractal noise filter to render clouds. Use of "Sample without replacement" to randomly iterate through an array (of cars) painted to the screen via Greensock.

Feature-Set

Feature

Notes

Status

React 16.3.2
Animation GreenSock.js
Normalization normalize.css pending
Tooling Webpack
preprocessing babel
CSS Styled Components

NightScape II

Acknowledgement

Inspired by the excellent work of "@yuanchuan" whom you should most definitely follow!

Thanks, too, to "@Claudia_Perlich" for the sampling advice.

Issues

Currently looks like 💩 in Safari.

About

Experimental use of SVG filters with CSS to render clouds (CSS-Tricks Article). Sample with replacement used to randomize highway traffic in the foreground.

https://codepen.io/beauhaus/full/OaRwbm

License:MIT License


Languages

Language:JavaScript 98.0%Language:CSS 1.5%Language:HTML 0.5%