56,966 blogs · [ { "id": "01a0875f-73bf-7074-9dd7-54ab81e81a00", "title": "DOOM runs in ChatGPT and Claude", "url": "https://chrisnager.com/blog/doom-runs-in-chatgpt-and-claude", "published_at": "2026-04-17T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab82c49225", "title": "Custom design system MCP", "url": "https://www.linkedin.com/posts/activity-7344402049108766720-PH8G", "published_at": "2025-06-27T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab83505cdd", "title": "Vibe coding with your design system", "url": "https://chrisnager.com/blog/vibe-coding-with-your-design-system", "published_at": "2025-05-18T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab835cf8d9", "title": "Vibe coding", "url": "https://chrisnager.com/blog/vibe-coding", "published_at": "2025-04-06T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab838e6be9", "title": "Design engineering", "url": "https://chrisnager.com/blog/design-engineering", "published_at": "2024-08-11T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab843548f5", "title": "Return to Vim", "url": "https://chrisnager.com/blog/return-to-vim", "published_at": "2024-02-28T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8496d6da", "title": "My GPTs", "url": "https://chrisnager.com/blog/my-gpts", "published_at": "2023-11-06T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab85248370", "title": "AI image prompts", "url": "https://chrisnager.com/blog/ai-image-prompts", "published_at": "2023-04-22T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab861819b9", "title": "CodePen Radio 362: Chris Nager", "url": "https://blog.codepen.io/2022/04/06/362-chris-nager", "published_at": "2022-04-06T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab862b9b3c", "title": "Time for a change", "url": "https://chrisnager.com/blog/time-for-a-change", "published_at": "2020-04-23T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8704709c", "title": "Zephyr", "url": "https://chrisnager.github.io/zephyr", "published_at": "2020-01-31T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab87992faa", "title": "Designing today's digital products", "url": "https://www.meetup.com/Brooklyn-Technology-Startups/events/263459622/", "published_at": "2019-09-11T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab880d2897", "title": "Lifecycle of an icon", "url": "https://youtu.be/QCizRxi0fek", "published_at": "2019-03-06T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab88a1f348", "title": "Design system", "url": "https://chrisnager.com", "published_at": "2018-07-09T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab88fb3320", "title": "Takeaways from F8 2018", "url": "https://medium.com/@chrisnager/takeaways-from-f8-2018-3dde54919490", "published_at": "2018-05-11T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab892fda73", "title": "Case for a monorepo", "url": "https://medium.com/@chrisnager/case-for-a-monorepo-28cebf26e1aa", "published_at": "2018-03-20T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab89c1e150", "title": "When - Chatbot for location recommendations", "url": "https://techcrunch.com/video/whentho/591879ff1de5a12724606c06", "published_at": "2017-01-01T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab89cba39a", "title": "Stack your classes within template literals", "url": "https://medium.com/@chrisnager/stack-your-classes-within-template-literals-d537bf463d4a", "published_at": "2016-03-09T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8a180c1a", "title": "Center and crop images with a single line of CSS", "url": "https://medium.com/@chrisnager/center-and-crop-images-with-a-single-line-of-css-ad140d5b4a87", "published_at": "2015-01-19T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8a382176", "title": "Cheer me up - Fun, custom pages in seconds", "url": "https://techcrunch.com/video/cheer-me-up/518803581", "published_at": "2015-01-01T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8a8597f2", "title": "Bespoke SVG reference", "url": "https://medium.com/@chrisnager/bespoke-svg-reference-e22eb733272", "published_at": "2014-05-23T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8ae4c093", "title": "Analog-style LED clock concept", "url": "https://chrisnager.com/analog-style-led-clock-concept", "published_at": "2014-03-25T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8b38c0df", "title": "Simple vertical centering with CSS", "url": "https://chrisnager.com/blog/simple-vertical-centering-with-css", "published_at": "2014-01-10T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8b9b05ec", "title": "NYC Subway Lines reimagined with long shadow design", "url": "https://chrisnager.com/nyc-subway-lines-reimagined-with-longshadowdesign", "published_at": "2013-06-29T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8c7d6218", "title": "Time-based media queries", "url": "https://chrisnager.com/time-based-media-queries", "published_at": "2013-03-25T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8d4ba746", "title": "Hue bump with Sass @for control directive", "url": "https://chrisnager.com/hue-bump-with-sass-for-control-directive", "published_at": "2013-01-17T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8dcbf8c3", "title": "Display icons with custom data-attributes", "url": "https://chrisnager.com/display-icons-with-custom-data-attributes", "published_at": "2012-12-21T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8ea8f0a1", "title": "Circles", "url": "https://chrisnager.com/circles", "published_at": "2012-12-19T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8f05b43d", "title": "Further simplified hexcodes", "url": "https://chrisnager.com/further-simplified-hexcodes", "published_at": "2012-12-18T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8f4bcee4", "title": "Box sizing for pseudo elements", "url": "https://chrisnager.com/box-sizing-for-pseudo-elements", "published_at": "2012-12-09T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab8f8fa25c", "title": "Video and audio in CSS", "url": "https://chrisnager.com/blog/video-and-audio-in-css", "published_at": "2012-12-04T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab9054e4e1", "title": "Natural curves", "url": "https://chrisnager.com/natural-curves", "published_at": "2012-11-08T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab9133a146", "title": "My initials", "url": "https://chrisnager.com/my-initials", "published_at": "2012-10-23T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab91f7f1be", "title": "Touchable textures with CSS - can you feel me?", "url": "https://chrisnager.com/touchable-textures-with-css-can-you-feel-me", "published_at": "2012-10-18T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab921edb2c", "title": "An Event Apart and a designer’s view of the web", "url": "https://chrisnager.com/an-event-apart-and-a-designer-e2-80-99s-view-of-the-web", "published_at": "2011-12-23T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab921f8256", "title": "CSS3 ::selection background color trick", "url": "https://chrisnager.com/blog/css3-selection-background-color-trick", "published_at": "2011-09-09T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab931d411c", "title": "Chris Nager 2012 (responsive design)", "url": "https://chrisnager.com/chris-nager-2012", "published_at": "2011-08-18T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab932349a5", "title": "ChrisNager.com v2 is live", "url": "https://chrisnager.comchrisnager-com-v2-is-live", "published_at": "2011-06-12T00:00:00+00:00" }, { "id": "01a0875f-73bf-7074-9dd7-54ab9339bf30", "title": "fr.sh", "url": "https://github.com/chrisnager/fr", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab93caffe3", "title": "CSS-only barcodes", "url": "https://chrisnager.com/projects/barcode/", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab94929b4d", "title": "Snowball", "url": "https://chrisnager.com/snowball/", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab94b80738", "title": "Palegen", "url": "https://chrisnager.com/palegen/", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab957925f1", "title": "Reverse a sound", "url": "https://chrisnager.com/projects/reverse-a-sound", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab957e721a", "title": "Elevator Pitch", "url": "https://chat.openai.com/g/g-4P6Atbe0O-elevator-pitch", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab95a89d59", "title": "4-7-8 breathing", "url": "https://chrisnager.com/478", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab962cd54b", "title": "Affirmations", "url": "https://chrisnager.com/affirmations", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab9693d11a", "title": "hAIku", "url": "https://haiku-chrisnager.netlify.app", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab96df181e", "title": "Tiles", "url": "https://chrisnager-tiles.netlify.app", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab974611f3", "title": "CartaX", "url": "https://twitter.com/chrisnager/status/1334261919126052864", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab9838da14", "title": "Accessible gradients", "url": "https://codepen.io/chrisnager/pen/rNpmWMj", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab9895b7ab", "title": "Snordle", "url": "https://chrisnager.com/snordle", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab992ec59c", "title": "ASCII", "url": "https://chrisnager.com/ascii", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab99bc451d", "title": "Support NYC DTC", "url": "https://supportnycdtc.com", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab9a6f3f64", "title": "GIPHY Vercel integration", "url": "https://vercel.com/integrations/giphy", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab9b586b6b", "title": "Cube DJ", "url": "http://cuber.club/dj", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab9c322399", "title": "chrisnager.com v4", "url": "https://www.gatsbyjs.com/showcase/chrisnager.com", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab9cf1c0e2", "title": "Stocks", "url": "https://iextrading.com/apps/stocks/", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab9d4c73fe", "title": "Color contrast", "url": "https://zephyr.air.inc/foundations/color", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab9d8071f1", "title": "Emoonji", "url": "https://chrisnager.github.io/emoonji", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab9d89538b", "title": "Bendies", "url": "https://chrisnager.github.io/generative-art/bendies", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab9e49174c", "title": "ungrid", "url": "https://chrisnager.github.io/ungrid", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab9f08f4b4", "title": "Zephyr", "url": "https://chrisnager.com/zephyr", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54ab9ffa69f7", "title": "hexcodes", "url": "https://chrisnager.github.io/hexcodes", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54aba0341c9f", "title": "Salesforce Marketing Cloud", "url": "https://www.youtube.com/embed/295brS23_4I", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54aba129cd2b", "title": "Diagonals", "url": "https://chrisnager.github.io/generative-art/diagonals", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54aba1601596", "title": "iextrading.com", "url": "https://iextrading.com", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54aba1a6a6c5", "title": "air.inc", "url": "https://air.inc", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54aba24b0702", "title": "simple-debug.css", "url": "https://chrisnager.github.io/simple-debug.css", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54aba2b8f90c", "title": "Simple", "url": "https://chrisnager.github.io/simple-paper-spinner", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54aba3a6f240", "title": "Icon theming", "url": "https://zephyr.air.inc/icon-theming", "published_at": null }, { "id": "01a0875f-73bf-7074-9dd7-54aba446c580", "title": "tiny google fonts", "url": "https://chrisnager.github.io/tiny-google-fonts", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6d0af17ad", "title": "Market", "url": "https://iextrading.com/apps/market/", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6d17d30e3", "title": "Signum majoritatis", "url": "http://bit.ly/smajor", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6d26fedaa", "title": "Corners", "url": "https://chrisnager.github.io/generative-art/corners", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6d32264e4", "title": "Give 'n' Go", "url": "http://give-n-go.co", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6d3848b44", "title": "IEX iOS and Android apps", "url": "https://iextrading.com/apps", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6d477f96c", "title": "Cheer me up", "url": "https://devpost.com/software/cheer-me-up", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6d574ef6e", "title": "Until", "url": "https://chrisnager.github.io/until", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6d63e7393", "title": "UN Disaster Response", "url": "http://vimeo.com/71911497", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6d6429ea8", "title": "Jaunt", "url": "http://disruptnyhackathon.challengepost.com/submissions/23514-jaunt", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6d65ecca8", "title": "Cursors", "url": "https://chrisnager.github.io/cursors", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6d741aa4d", "title": "The IEX API", "url": "https://iextrading.com/developers/docs", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6d81d4a74", "title": "simple-palette", "url": "https://chrisnager.github.io/simple-palette", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6d8e84237", "title": "pride", "url": "https://github.com/chrisnager/pride", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6d925ccfb", "title": "✂ short color names", "url": "https://chrisnager.github.io/short-color-names", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6da1bd147", "title": "IEX branding and guidelines", "url": "https://iextrading.com/brand/", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6da4d68a1", "title": "Birthday hex", "url": "https://chrisnager.github.io/birthday-hex", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6dab59744", "title": "SVG Please", "url": "https://chrisnager.github.io/svg-please", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6db4442c8", "title": "Fav5", "url": "http://fav5.co", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6db48eaf3", "title": "chrisnager.com v3", "url": "https://chrisnager.github.io", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6db98d43e", "title": "Twadlib!", "url": "https://chrisnager.github.io/twadlib", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6dc52ff71", "title": "Bliss", "url": "https://chrisnager.github.io/bliss", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6dd1c4ebd", "title": "Crafted CSS", "url": "https://chrisnager.github.io/crafted-css", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6de07a56e", "title": "Social Logos", "url": "https://chrisnager.github.io/social-logos", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6de2f25c5", "title": "Ben Thomson Photo", "url": "http://www.awwwards.com/web-design-awards/ben-thomson-photography", "published_at": null }, { "id": "01a0875f-73c0-72d0-9d85-37b6de9f4706", "title": "Totally Fresh", "url": "http://coding.smashingmagazine.com/2010/07/12/css3-design-contest-results/", "published_at": null } ] posts Claim your blog

Back to chrisnager.com

Blog · corpus.blog/blogs/chrisnager.com/posts

chrisnager.com

chrisnager.com

2026

DOOM runs in ChatGPT and Claude original ↗

17 Apr 2026

2025

Custom design system MCP original ↗

27 Jun 2025

Vibe coding with your design system original ↗

18 May 2025

Vibe coding original ↗

6 Apr 2025

2024

Design engineering original ↗

11 Aug 2024

Return to Vim original ↗

28 Feb 2024

2023

My GPTs original ↗

6 Nov 2023

AI image prompts original ↗

22 Apr 2023

2022

CodePen Radio 362: Chris Nager original ↗

6 Apr 2022

2020

Time for a change original ↗

23 Apr 2020

Zephyr original ↗

31 Jan 2020

2019

Designing today's digital products original ↗

11 Sept 2019

Lifecycle of an icon original ↗

6 Mar 2019

2018

Design system original ↗

9 Jul 2018

Takeaways from F8 2018 original ↗

11 May 2018

Case for a monorepo original ↗

20 Mar 2018

2017

When - Chatbot for location recommendations original ↗

1 Jan 2017

2016

Stack your classes within template literals original ↗

9 Mar 2016

2015

Center and crop images with a single line of CSS original ↗

19 Jan 2015

Cheer me up - Fun, custom pages in seconds original ↗

1 Jan 2015

2014

Bespoke SVG reference original ↗

23 May 2014

Analog-style LED clock concept original ↗

25 Mar 2014

Simple vertical centering with CSS original ↗

10 Jan 2014

2013

NYC Subway Lines reimagined with long shadow design original ↗

29 Jun 2013

Time-based media queries original ↗

25 Mar 2013

Hue bump with Sass @for control directive original ↗

17 Jan 2013

2012

Display icons with custom data-attributes original ↗

21 Dec 2012

Circles original ↗

19 Dec 2012

Further simplified hexcodes original ↗

18 Dec 2012

Box sizing for pseudo elements original ↗

9 Dec 2012

Video and audio in CSS original ↗

4 Dec 2012

Natural curves original ↗

8 Nov 2012

My initials original ↗

23 Oct 2012

Touchable textures with CSS - can you feel me?original ↗

18 Oct 2012

2011

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

23 Dec 2011

CSS3 ::selection background color trick original ↗

9 Sept 2011

Chris Nager 2012 (responsive design)original ↗

18 Aug 2011

ChrisNager.com v2 is live original ↗

12 Jun 2011

Undated

fr.sh original ↗

—

CSS-only barcodes original ↗

—

Snowball original ↗

—

Palegen original ↗

—

Reverse a sound original ↗

—

Elevator Pitch original ↗

—

4-7-8 breathing original ↗

—

Affirmations original ↗

—

hAIku original ↗

—

Tiles original ↗

—

CartaX original ↗

—

Accessible gradients original ↗

—

Snordle original ↗

—

ASCII original ↗

—

Support NYC DTC original ↗

—

GIPHY Vercel integration original ↗

—

Cube DJ original ↗

—

chrisnager.com v4 original ↗

—

Stocks original ↗

—

Color contrast original ↗

—

Emoonji original ↗

—

Bendies original ↗

—

ungrid original ↗

—

Zephyr original ↗

—

hexcodes original ↗

—

Salesforce Marketing Cloud original ↗

—

Diagonals original ↗

—

iextrading.com original ↗

—

air.inc original ↗

—

simple-debug.css original ↗

—

Simple original ↗

—

Icon theming original ↗

—

tiny google fonts original ↗

—

Market original ↗

—

Signum majoritatis original ↗

—

Corners original ↗

—

Give 'n' Go original ↗

—

IEX iOS and Android apps original ↗

—

Cheer me up original ↗

—

Until original ↗

—

UN Disaster Response original ↗

—

Jaunt original ↗

—

Cursors original ↗

—

The IEX API original ↗

—

simple-palette original ↗

—

pride original ↗

—

✂ short color names original ↗

—

IEX branding and guidelines original ↗

—

Birthday hex original ↗

—

SVG Please original ↗

—

Fav5 original ↗

—

chrisnager.com v3 original ↗

—

Twadlib!original ↗

—

Bliss original ↗

—

Crafted CSS original ↗

—

Social Logos original ↗

—

Ben Thomson Photo original ↗

—

Totally Fresh original ↗

—