Josh W. Comeau
joshwcomeau.com · Personal blog · on HN since 2018
Josh W. Comeau, a front-end developer and educator, writes interactive tutorials on CSS, React and web accessibility.
What HN saysHN commenters recommend it as excellent for front-end developers and praise his comprehensive CSS course as pricey but worthwhile.
199HN people shared it
84linked it in comments
268stories submitted
11Kstory points
3 months agolast shared
2018people per year2026
Most-shared posts
- 1An interactive guide to Flexbox21 people · 844 points · first shared 2022 · 86 comments on HN
- 2Homepage18 people · first shared 2020
- 3Hands-free coding: how I develop software using dictation and eye-tracking13 people · 13 points · first shared 2021 · discussion on HN
- 4My Custom CSS Reset11 people · 310 points · first shared 2021 · 56 comments on HN
- 5Pixels and Accessibility9 people · 72 points · first shared 2022 · 19 comments on HN
- 6Understanding Layout Algorithms9 people · 37 points · first shared 2022 · discussion on HN
- 7A Friendly Introduction to CSS Container Queries8 people · 16 points · first shared 2024 · 2 comments on HN
- 8How to build a hybrid static-dynamic blog with MDX7 people · 6 points · first shared 2021 · discussion on HN
- 9Shadow Palette Generator, a tool to create lush, realistic shadows in CSS7 people · 5 points · first shared 2021 · 1 comments on HN
- 10An interactive guide to CSS transitions6 people · 322 points · first shared 2021 · 40 comments on HN
- 11Building a Magical 3D Button with Vanilla HTML/CSS6 people · 139 points · first shared 2021 · 30 comments on HN
- 12Scroll-Driven Animations6 people · 9 points · first shared 2026 · discussion on HN
- 13Color Formats in CSS6 people · 7 points · first shared 2022 · discussion on HN
- 14An Interactive Guide to CSS Grid6 people · 6 points · first shared 2023 · discussion on HN
- 15How to Learn Stuff Quickly5 people · 815 points · first shared 2021 · 88 comments on HN
What HN people wrote when they linked it
satvikpendem · 2026-01-05
I largely agree with this article, and while CSS is pretty hacky due to having to keep up with backward compatibility since the earliest implementation, modern CSS is pretty good for laying out designs.
I recommend Josh W Comeau's CSS for JS devs [0]. If you've seen his other articles on CSS and on web dev in general [1], you know that he's a great teacher of complex topics.
The course is priced for corporations to buy via their employee development budget, which is how I took it, so for individuals it is steep, but if you can convince your employer to pay, I don't think there's a better CSS course out there.
[0] https://css-for-js.dev/
[1] https://www.joshwcomeau.com/
dtagames · 2023-12-27
Yes! I highly recommend Josh's comprehensive CSS course. It's not cheap but it is well worth it.
https://www.joshwcomeau.com/
pcthrowaway · 2022-11-22
If you have any interest in front-end development, https://www.joshwcomeau.com/ is excellent
conartist · 2022-02-07
Some of my favorites more Frontend leaning:
- https://www.joshwcomeau.com/
- https://jhey.dev/writing/
- https://varun.ca/writing
- https://ishadeed.com/articles/
rpastuszak · 2026-03-29
Love this. I especially liked shape based reflow example.
This is something I've been thinking for ages and would love to add to Ensō (enso.sonnet.io), purely because it would allow me to apply better caret transitions between the lines of text.
(I'm not gonna do that because I'm trying to keep it simple, but it's a strong temptation)
Now a CSS tangent: regarding the accordion example from the site (https://chenglou.me/pretext/accordion), this can be solved with pure CSS (and then perhaps a JS fallback) using the `interpolate-size` property.
https://www.joshwcomeau.com/snippets/html/interpolate-size/
Regarding the text bubbles problem (https://chenglou.me/pretext/bubbles), you can use `text-wrap: balance | pretty` to achieve the same result.
(`balance` IIRC evens out the # of lines)
chrismorgan · 2025-07-02
This suffers from the problem of only blurring using the pixels immediately behind the surface, as demonstrated well in https://www.joshwcomeau.com/css/backdrop-filter/#the-issue. That and the discussion in https://news.ycombinator.com/item?id=42302907 are good reading. If the backdrop is going to move underneath, this is fairly important; if it will be static, it’s not normally important.
blazerunner · 2025-01-06
Not new, but Josh W. Comeau's blog posts (https://www.joshwcomeau.com) on frontend and React are always next-level, you can tell there's passion in the details.
smarkov · 2025-01-05
I highly recommend Josh's guide: https://www.joshwcomeau.com/css/interactive-guide-to-flexbox/
It goes over more advanced gotchas and tips in detail such as flex-basis, auto margins, min-width, etc.
victor106 · 2024-09-15
I follow this
https://www.joshwcomeau.com/css/custom-css-reset/
jonahx · 2024-02-29
(not affiliated, just a happy user)
It's paid, but if you want to deeply learn CSS interactively, I can't recommend this course enough:
https://css-for-js.dev/
Not just the best CSS resource I've encountered, but one of the best examples of interactive pedagogy period I've encountered.
The author also has lots of free resources if you want to get a flavor of the style:
https://www.joshwcomeau.com/tutorials/css/
brikym · 2024-02-29
In addition:
- Flexbox froggy is the best way to learn flex.
- Before you even start writing anything find someone elses css-reset rules as that'll replace years of legacy backwards compatible behaviour with some sane defaults. (e.g. https://www.joshwcomeau.com/css/custom-css-reset/#our-finished-product…
alex_suzuki · 2024-02-13
Thanks for the amazing article, Josh! I‘ve come to use your CSS reset on a regular basis: https://www.joshwcomeau.com/css/custom-css-reset/
adeptima · 2023-11-24
IMHO The best An Interactive Guides
Flexbox
https://www.joshwcomeau.com/css/interactive-guide-to-flexbox/
Grid
https://www.joshwcomeau.com/css/interactive-guide-to-grid/
chrisweekly · 2023-11-13
When it comes to teaching web dev fundamentals, the sequence HTML -> CSS -> JS makes the most sense to me. They're 3 legs of a stool. CSS is an underappreciated but absolutely essential facet of accessible, standards-based web development. https://every-layout.dev and https://www.joshwcomeau.com/tutorials/css/ are great resources.
p4ul · 2023-08-30
I know you asked specifically about books, but I can’t help but recommend the two online courses that Josh Comeau makes available. I have found both the “CSS for JavaScript Developers” and the “Joy of React” courses to be absolutely phenomenal!
Josh’s teaching style is exceptional, and the courses’ exercises challenge you to work just at the edge of your abilities. I cannot recommend these courses enough!!
https://www.joshwcomeau.com/courses/
jacobedawson · 2023-08-15
Best practice in general is not to use either of those hooks unless you notice performance issues, or have a good reason to, React is optimized pretty well and unless there are serious numbers of rerenders happening they aren't noticeable.
Josh Comeau has a nice overview of useMemo and useCallback, one of my favourites: https://www.joshwcomeau.com/react/usememo-and-usecallback/#when-to-use…
poetril · 2023-07-13
I've been working with html/css for nearly a decade and still reference [0] this article from time to time. Best explanation of how css layout algorithms out there.
[0]: https://www.joshwcomeau.com/css/understanding-layout-algorithms/
hifix · 2023-06-12
I personally enjoy any sort of interactivity in tech articles. Things like sliders, inputs and buttons are great at keeping attention and can help make the subject easier to understand or illustrate things that can't easily be described in text.
Some examples:
https://liveblocks.io/blog/how-to-animate-multiplayer-cursors
https://www.joshwcomeau.com/css/interactive-guide-to-flexbox
https://ciechanow.ski/bicycle/
Although it's all very content dependent of course - FE development tends to lend itself a bit better to this sort of format.
georgehill · 2023-02-20
Also worth reading https://www.joshwcomeau.com/blog/how-i-built-my-blog
foxandmouse · 2023-01-09
Hey Josh, I'm eagerly anticipating your React course, could provide any hints on when it'll be ready for release :)
I love your approach of breaking down complex concepts into their fundamental components and then reassemble them from the ground up! Many tutorials rely on reasoning by analogy, but I find your approach helps the reader build a mental model to think about the problem on their own.
Your interactive guide to flex box is a great example of this:
https://www.joshwcomeau.com/css/interactive-guide-to-flexbox/
ohmahjong · 2022-11-15
Here is another excellent breakdown by Joshua Comeau, who is my go-to for all things CSS-related. He goes over the practical cases where you do want to mix and match units, how browser zooming affects accessibility, etc.
https://www.joshwcomeau.com/css/surprising-truth-about-pixels-and-acce…
latchkey · 2022-08-30
His previous one on rerenders was fantastic... many lightbulb moments.
https://www.joshwcomeau.com/react/why-react-re-renders/
FB should hire him to rewrite their docs.
Wowfunhappy · 2022-06-17
I'm a sucker for good little microinteractions. The author's checkbox may not be one of those, as it seems a bit overdone, but I'd have to try it to be sure. It's easy to go too far.
But, some other examples that I love:
• https://www.joshwcomeau.com/animation/3d-button The red "push me" button is great, but also check out the sun/moon icon near the top right!
• https://www.jam3.com/#contact The hover states on the buttons.
• https://citymapper.com The top-left hamburger icon.
(I also happen to be quite proud of the hover states on my own site: https://jonathanalland.com/)
Making this type of stuff is definitely what I miss most about working in web design.
asicsp · 2022-03-16
Check out https://www.joshwcomeau.com/
Articles are discussed here often: https://news.ycombinator.com/from?site=joshwcomeau.com
Pr0ject217 · 2022-02-07
EDIT:
Paste this hacky snippet into your browser's console to save all of the links into your clipboard:
(() =>
{
let result = [...document.querySelectorAll('td a')]
.map((link) =>
link &&
!link.href.includes('ycombinator') &&
!link.href.includes('javascript:void')
? link.href
: ''
)
.filter(Boolean);
result = [...new Set(result)];
result.sort();
copy(result.join('\n\n'));
})();
Just to help, here's a compiled-list of all of the links shared here so…
elefantastisch · 2022-02-07
Julia Evans: https://jvns.ca/
Josh W Comeau: https://www.joshwcomeau.com/
eatonphil · 2022-01-11
The gradient generator Josh introduces here is pretty nice [0]! And the HSL vs RGB theory is also pretty interesting. I'll give this generator a try next time I want one.
But my favorite gradient generator at the moment (most pleasant gradients IMO) is still [1].
[0] https://www.joshwcomeau.com/gradient-generator/
[1] https://mycolor.space/gradient
willio58 · 2021-12-03
Yeah auto-music is bad. Sound effects are hard to do too, although when done well they can work (at least for me). Example of a site with sound effects that isn't overwhelming: https://www.joshwcomeau.com/
sarimabbas · 2021-05-27
For me:
- https://twopagesdoublespaced.substack.com/ - short form non-fiction
- https://www.joshwcomeau.com/ - technical snippets
- http://paulgraham.com/ - entrepreneurship
- https://audacity.substack.com/ - a variety of talented writers
bnchrch · 2020-11-20
This feels like both an anecdote and a straw man.
I can point to two blogs on either side that have a lot to offer.
Large bundle: https://www.joshwcomeau.com/
Small Bundle: https://www.eugenewei.com/