About

Trying to make the web as fast as possible, highly readable, 100% responsive, and easy to navigate.

I like building tools that help automate the design process.

Advocate for users and open-source.

Open Source

gradients

Curated css gradients
446 bytes

randoma11y

Random a11y color combination generator.

iOS dynamic type

CSS module for utilizing iOS dynamic type settings.

profile

Mobile friendly github profile viewer.

btns

Extemely light-weight css module for constructing responsive buttons.
663 bytes

diatonic type

A traditional type-scale for print translated for the web.

type.css

Tiny css module for a mobile-first responsive type scale.
683 bytes

fluidity

A css shim to make html a bit more responsive out of the box. 247 bytes

links

Better default links for the web. Easy to customize and/or extend. 155 bytes

css uncut

Everything from the css spec broken up into single purpose classes. ~45kb

package

A template I use for package.json files

contrast

Readable type contrasts.

mnml

Minimal template to design in the browser with html & postcss.

trim

Prototype setup to build light-weight, more performant websites.

html

Every html element from the spec - on one page. Useful as a base to starting a css framework from scratch.

WRITING

CSS and Scalability The Veil of Ignorance Design Systems Too Many Tools and Frameworks Webfonts Tools for Designing in the Browser Web Design Process Reading Materials What are Classes for? Mobile-first CSS Good CSS What is CSS for? Does CSS Performance matter? Learning CSS How to Line-Height Hack Design #51: Vim as a Design Tool

Interviews / Podcasts

Type Thursday "Three Considerations To Make Your Typography More Accessible" Design Details "Lego Bits (feat. Adam Morse)" Web Friends "The authentic Adam Morse" View Sources "Vim as a design tool"

Talks

Things I’ve Learned About CSS During 10 Years of Typing it Sometimes

CSSConf Oakland - November 2014

Exploring the power of Abstract Syntax Trees

The Mixin SF - November 2013

Designing with CSS

Thoughtbot - January 2014

The Future of CSS is JS

BeerJS - July 2015

What is CSS For?

HarbourFront Meetup -July 2015

Screencasts

Vim project setup window management, saving sessions, opening files, saving files and more Editing output from an external process with Vim unix, :r, :!, visual-block mode, recording a macro Fun with svg and Vim registers, macros, :bufdo Vim - Download a file under your cursor motions, visual mode, registers, curl, :! Speedcast: Building an HSLA visualizer in under 5 minutes visual-block mode, macros, ctrl-a Speedcast: Responsive photo grid in 5:20 gulp, npm, grid, tachyons, visual block, :%s Designing in the browser gulp, npm, tachyons Deleting an entire file in vim :%d, ggdG

Fun

gifolio

My portfolio in gif format. With music.

up & in thirds

Photography collection.

mrsjxn

Post-future beats made with jxnblk.

Purchase on iTunes
No Love Valis Minibaar