califat’s gists

califat / audio-visualizer2.markdown

Created June 7, 2017 02:41 — forked from anonymous/audio-visualizer2.markdown

Audio Visualizer2

califat / index.html

Created June 3, 2017 03:34 — forked from anonymous/index.html

mouse position color picker (scroll for saturation)

	<div class="js-picker picker">
	<svg class="cursor js-cursor" width="278" height="278" viewBox="0 0 278 278" xmlns="http://www.w3.org/2000/svg"><g fill-rule="nonzero" fill="#000"><g fill-rule="nonzero" fill="#000"><path class="filter" d="M179.023 128.25c2.18-2.186 2.18-5.68 0-7.866L63.425 4.596c-2.618-2.62-6.107-4.04-9.815-4.04H14.46C6.824.555.61 6.78.61 14.425v39.216c0 3.66 1.47 7.21 4.034 9.83l115.6 115.79c2.18 2.184 5.67 2.184 7.85 0l50.93-51.013z"/><path d="M270.74 259.384c11.23-16.658 7.796-39.324-6.38-53.58l-42.805-42.82 15.704-15.674c2.18-2.184 2.18-5.68 0-7.865l-11.78-11.797c-2.126-2.13-5.452-2.13-7.633-.11l-90.46 90.61c-2.02 2.185-1.964 5.57.108 7.647l11.778 11.797c2.18 2.185 5.67 2.185 7.852 0l15.704-15.675 43.893 43.966c18.05 18.024 48.857 15.894 64.016-6.5z"/></g></g></svg>

	<header>
	<h2 class="js-picker__colorName">Hot Pink</h2>
	<h1 class="js-picker__colorValue">#ff69b4</h1>
	</header>
	</div>

califat / script.babel

Created June 3, 2017 03:33 — forked from anonymous/script.babel

Waterdroplet WebGL Shader

	/**
	* Raindrop fragment shader, being used by PIXI.js in the EffectCanvas object
	* {{uniforms: {time: {type: string, value: number}, iResolution: {type: string, value: [*]}}, fragment: string}}
	*/
	const shaderData = {
	uniforms: {
	iResolution: {
	type: 'v2',
	value: [
	window.innerWidth,

califat / index.html

Created June 3, 2017 03:28 — forked from anonymous/index.html

▶ Liquid Button

	<!-- https://twitter.com/wearenextcode -->
	<!-- https://twitter.com/TaminoMartinius -->

califat / index.html

Created June 1, 2017 05:32 — forked from anonymous/index.html

Resize, Drag, Snap


	<div id="pane">
	<div id="title">Resize, Drag or Snap Me!</div>
	</div>
	<div id="ghostpane"></div>

califat / css-icons.haml

Created May 28, 2017 20:50 — forked from jalbertbowden/css-icons.haml

css icons - A CodePen by Andreas Storm. free css icon set - feel free to use this little icon set for your work

califat / index.html

Created May 18, 2017 14:10 — forked from anonymous/index.html

Ugly Thing

	<div id="content">
	<span class="expand">
	Oh well, heil Hitler, bitch! And let me tell you something else. So what're you saying? Like, I shot someone with, like, a gun? We flipped a coin, okay? You and me. You and me! Coin flip is sacred!
	</span>
	</div>
	<div id="content">
	<span class="expand">
	Your job is waiting for you in that basement, as per the coin! I took this vo-tech class in high school, woodworking. I took a lot of vo-tech classes, because it was just big jerk-off, but this one time I had
	</span>
	</div>

califat / css-eevee.markdown

Created May 16, 2017 09:08 — forked from anonymous/css-eevee.markdown

CSS Eevee

Inspired by Pokemon Go, a CSS-only animated version of Eevee. Works best in Chrome and Firefox.

califat / index.html

Created May 3, 2017 05:23 — forked from anonymous/index.html

Stars (interactive)

califat / index.html

Created April 20, 2017 13:29 — forked from anonymous/index.html

Rollercoaster Island

	<div id="container"></div>
	<div id="info">
	<div class="mode">
	<div class="action" id="vr_mode"><span>vr mode <br/>(Split Screen + Device Orientation)</span></div>
	<div class="action" id="desktop_mode"><span>desktop mode</span></div>
	</div>
	<div class="attraction">
	<div class="action" id="rollercoaster"><span>rollercoaster</span></div>
	<div class="action" id="ferris_wheel"><span>ferris wheel</span></div>
	<div class="action" id="monster"><span>monster</span></div>