Chris Nager

DOOM runs in ChatGPT and Claude

Fri, 17 Apr 2026 00:00:00 GMT

Custom design system MCP

Fri, 27 Jun 2025 00:00:00 GMT

Vibe coding with your design system

Sun, 18 May 2025 00:00:00 GMT

Vibe coding

Sun, 06 Apr 2025 00:00:00 GMT

Design engineering

Sun, 11 Aug 2024 00:00:00 GMT

Return to Vim

Wed, 28 Feb 2024 00:00:00 GMT

My GPTs

Mon, 06 Nov 2023 00:00:00 GMT

AI image prompts

Sat, 22 Apr 2023 00:00:00 GMT

CodePen Radio 362: Chris Nager

Wed, 06 Apr 2022 00:00:00 GMT

A chat with Chris Coyier about web accessibility and new CSS features

Time for a change

Thu, 23 Apr 2020 00:00:00 GMT

Zephyr

Fri, 31 Jan 2020 00:00:00 GMT

A deep dive into our design system at Air

Designing today's digital products

Wed, 11 Sep 2019 00:00:00 GMT

Organized, hosted, and spoke at the second Brooklyn Tech Startups event

Lifecycle of an icon

Wed, 06 Mar 2019 00:00:00 GMT

Air's icon creation process, from ideation to implementation (Organized, hosted, and spoke at the first Brooklyn Tech Startups event)

Design system

Mon, 09 Jul 2018 00:00:00 GMT

Typography, icons, and documentation (Air internal company presentation)

Takeaways from F8 2018

Fri, 11 May 2018 00:00:00 GMT

Case for a monorepo

Tue, 20 Mar 2018 00:00:00 GMT

When - Chatbot for location recommendations

Sun, 01 Jan 2017 00:00:00 GMT

TechCrunch Disrupt Hackathon 2017 presentation

Stack your classes within template literals

Wed, 09 Mar 2016 00:00:00 GMT

React - The library that powers our apps

Fri, 01 Jan 2016 00:00:00 GMT

IEX internal company presentation

Center and crop images with a single line of CSS

Mon, 19 Jan 2015 00:00:00 GMT

Say hello to the IEX API

Thu, 01 Jan 2015 00:00:00 GMT

IEX internal company presentation

Cheer me up - Fun, custom pages in seconds

Thu, 01 Jan 2015 00:00:00 GMT

TechCrunch Disrupt Hackathon 2015 presentation

Bespoke SVG reference

Fri, 23 May 2014 00:00:00 GMT

Analog-style LED clock concept

Tue, 25 Mar 2014 00:00:00 GMT

Working with devs

Sun, 16 Feb 2014 00:00:00 GMT

Scotch Time Tech & Design Podcast

Simple vertical centering with CSS

Fri, 10 Jan 2014 00:00:00 GMT

A new era for CSS

Wed, 01 Jan 2014 00:00:00 GMT

Salesforce internal UX and Engineering presentation

1-on-1 Mentoring: Knowledge from within

Wed, 01 Jan 2014 00:00:00 GMT

Salesforce internal UX and Engineering presentation

Jaunt - Let your friends be your city guides

Wed, 01 Jan 2014 00:00:00 GMT

TechCrunch Disrupt Hackathon 2014 presentation

NYC Subway Lines reimagined with long shadow design

Sat, 29 Jun 2013 00:00:00 GMT

Time-based media queries

Mon, 25 Mar 2013 00:00:00 GMT

Hue bump with Sass @for control directive

Thu, 17 Jan 2013 00:00:00 GMT

Front end standards

Tue, 01 Jan 2013 00:00:00 GMT

Salesforce internal UX and Engineering presentation

Display icons with custom data-attributes

Fri, 21 Dec 2012 00:00:00 GMT

Circles

Wed, 19 Dec 2012 00:00:00 GMT

Further simplified hexcodes

Tue, 18 Dec 2012 00:00:00 GMT

Box sizing for pseudo elements

Sun, 09 Dec 2012 00:00:00 GMT

Video and audio in CSS

Tue, 04 Dec 2012 00:00:00 GMT

Natural curves

Thu, 08 Nov 2012 00:00:00 GMT

My initials

Tue, 23 Oct 2012 00:00:00 GMT

Touchable textures with CSS - can you feel me?

Thu, 18 Oct 2012 00:00:00 GMT

An Event Apart and a designer’s view of the web

Fri, 23 Dec 2011 00:00:00 GMT

CSS3 ::selection background color trick

Fri, 09 Sep 2011 00:00:00 GMT

Chris Nager 2012 (responsive design)

Thu, 18 Aug 2011 00:00:00 GMT

ChrisNager.com v2 is live

Sun, 12 Jun 2011 00:00:00 GMT

CSS3 capabilities

Sat, 01 Jan 2011 00:00:00 GMT

Luckie internal Design presentation

CSS3 playground

Sat, 28 Aug 2010 00:00:00 GMT

Presented at BarCamp

DOOM runs in ChatGPT and Claude

Playable DOOM MCP app that runs inline in compatible AI clients and falls back to a browser launch URL

CSS-only barcodes

Generate real EAN-13 barcodes with CSS-only visuals.

Snowball

You're a snowball. Collect snow to grow. Avoid lava. (Vibe Jam 2025 entry)

Palegen

Generate a brand palette from a single color.

Reverse a sound

Upload an audio clip and hear it backwards.

Elevator Pitch

GPT that summarizes companies in a single sentence

4-7-8 breathing

Enhance your calm.

Affirmations

You are enough.

hAIku

Write a haiku with AI.

Tiles

Generative typeface

CartaX

One small step for Carta, one giant leap for private markets

Accessible gradients

Find the most accessible gradient determined by the greatest contrast per colorspace. Built in CSS.

Snordle

Swipe or use the arrow keys to play SNAKE on a Wordle-style board.

ASCII

Make ASCII art with AI.

Support NYC DTC

Interactive map to support the DTC brands of NYC affected by COVID-19, recently featured in the Wall Street Journal and in Mapbox's newsletter

GIPHY Vercel integration

Discover GIFs from GIPHY in your Vercel Dashboard, built for the Vercel Hackathon

Cube DJ

DJ with your Rubik's cube as a MIDI controller

chrisnager.com v4

chrisnager.com featured in Gatsby's showcase

Stocks

IEX Stocks app - Search stocks, compare peers, see industry news, create watchlists

Color contrast

WCAG 2.0 color contrast checker for the Zephyr design system

Emoonji

A friendly chatbot that sends the current moon phases with emojis

Bendies

Fun with generated patterns

ungrid

the simplest responsive css grid

Zephyr

Design system and component library for Air

hexcodes

All possible three digit hexcodes

Salesforce Marketing Cloud

Collaborated on this product

Diagonals

Fun with generated patterns

iextrading.com

Site for IEX, creative blend of SSR + React, with Lighthouse scores of 100

air.inc

Site for Air

simple-debug.css

Debug your layouts with one line of CSS

Simple

How to rebuild Google's Material Design with a single div and CSS animations

Icon theming

Icon theming tool for the Zephyr design system

tiny google fonts

Strip down your google fonts significantly to only include the characters you're actually using

Market

Web app for IEX that displays near real-time market volume

Signum majoritatis

A side-scrolling game built in a single string

Corners

Fun with generated patterns

Give 'n' Go

A curated gallery of Dribbble shots reworked as interactive CodePen pens

IEX iOS and Android apps

Created iOS and Android apps for IEX

Cheer me up

Fun, custom pages in seconds

Until

Are we there yet?

UN Disaster Response

Worked with the Harvard Humanitarian Initiative on a disaster and humanitarian response survey building app to be used by the United Nations

Jaunt

Let your friends be your city guides. (TechCrunch Disrupt Hackathon app entry)

Cursors

All available cursors

The IEX API

The IEX API (now part of the IEX Cloud)

simple-palette

A simple color palette

pride

Simple hack to display the colors of the rainbow flag in the GitHub language bar. #lovewins

✂ short color names

The 44 CSS color names that are as short as or shorter than their corresponding hexcodes

IEX branding and guidelines

Logo, color palette, language, and branding guidelines for IEX

Birthday hex

Find your birthday hexcode

SVG Please

Simple script to replace your bitmap icons with inline SVGs with bitmap fallback built in

Fav5

What are your five most important items?

chrisnager.com v3

Care to reminisce?

Twadlib!

Ad-lib your tweets, submitted as a 10K Apart Challenge app entry

Bliss

Beautifully lean, ideal style sheets

Crafted CSS

A personal compilation of CSS practices I follow

Social Logos

Download official social logos

Ben Thomson Photo

Awwwards Site of the Day

Totally Fresh

Experimental CSS3 design featured on Smashing Magazine