> The color was originally going to be called beccapurple, but Meyer asked that it instead be named rebeccapurple, as his daughter had wanted to be called Rebecca once she had turned six. She had said that Becca was a "baby name," and that once she had turned six, she wanted to be called Rebecca. As Eric Meyer put it, "She made it to six. For almost twelve hours, she was six. So Rebecca it is and must be."
Eric Meyer's posts about his daughter's illness, and the family's lifelong process of grieving afterward, are heartbreaking. It's arresting, gripping writing. It's wonderful and awful. Hug your loved ones tight. https://meyerweb.com/eric/thoughts/category/personal/rebecca...
Thank you for linking this. I read bits and pieces of this as it was happening but it never fully registered for me at 24. I'm sitting here 10 years later at 34 having lost our son at 23 weeks. His due date was this past week. It's affected me in ways that still surprise, befuddle, and sometimes scare me. I cannot even begin to fathom what he's been through; the most recent blog post has me in tears.
I have really strong memories of learning HTML, CSS, and javascript in high school, and spending time in the school library picking apart css/edge. It felt like the dawn of a new era, I was in awe of the things I saw there. I built more than a few sites trying to get my head around the complexispiral demo, and spent countless hours diving into resources I found there (like A List Apart! I will never forget the suckerfish drop-downs). This is one of the few moments I have such vivid memories of that were directly responsible me for pursuing computer engineering and ultimately going so far into UI/UX and the web. I've never written it out this explicitly but: thank you for everything, Eric.
I'm so sorry to hear this. Dealing with this is much harder than most young people or non-parents would expect.
After successfully conceiving our first son through IVF on the first attempt, my wife and I experienced a failed IVF cycle this year while trying for a second child. This time, the embryo had been implanted, but it did not survive beyond two weeks. I thought I would be able to handle a failed IVF attempt more easily, knowing how statistically common it is. Yet, even just experiencing that was devastating.
I can’t imagine the pain of losing a child at 23 weeks, experiencing a miscarriage, or facing loss later on. Reading about the background of this color name brought tears to my eyes.
Thank you for sharing, Eric. It’s been a few years now for me since we lost our son before I ever had the chance to meet him and I’m not sure it’s any easier. Stories like yours and that of others help us all know we’re not alone in our grief though so I encourage you to keep sharing and telling your story.
Having never had children myself, his writing moved me in a way that I struggle to comprehend. I spent my 2 hour commute reading through all of his writing on his time, and subsequent grief of his daughter, starting here: https://meyerweb.com/eric/thoughts/2008/06/18/welcome-2/
I found this piece particularly moving, and brought me to tears:
I really don’t like these logos that are boxes with text in the lower right. The post cites a “common design language” with other tech but this has to be the most low effort language imaginable.
Not who you are replying to, but I started learning HTML/CSS right when HTML5 and CSS3 had just come out, so I do have somewhat of a soft spot for these
What is color blind unfriendly about the new logos precisely? Which variant of color blindness will not be able to read them?
Which visual impairment exactly will find it easier to parse the previous logos (which are a mess of design scarcely related to the actual technology name) than the current ones, which contain thick bold text indicating exactly what the technology is called?
Disagree, but then again my soulless engineer's heart has close to zero tolerance for design for design's sake, so what do I know?
The most important part about convoying that an item is CSS is including the letters CSS. So while I am a little disgusted they wasted time on an icon at all, I will admit that many of our design language structures demand an icon. So I am somewhat relieved they managed to dodge the design for design's sake crowd and picked the best possible one. A non-descript box with the letters CSS in it.
You're absolutely right, especially considering the canonical CSS-in-a-box logo has long been established [1], and they should really embrace it if they had any sense of humor.
Perhaps those brutalist logos were designed specifically such that they could be rendered using CSS itself?
Though I could understand why they'd want to distance themselves from the old "shield" logo that turned out to signify shielding "browser vendors" from broad implementation of CSS renderers and to keep a niche of job security at W3C, Inc. due to rampant and unwarranted complexity, but in any case was burnt by being placed next to vulgar metalhand vectors, not to speak of being culturally discriminative when viewed in a "woke" interpretation.
File Browser / Finder maybe, but the text inside the boxes are too small for IDE file trees.
VS Code shows "JS" in yellow text without the box, against a dark background. CSS is just a blue hash symbol. Maybe they'll change the color to rebeccapurple, but I don't think there's room for a box around the symbol.
I used rebeccapurple a lot as well, unknowing of the touching story behind it. I coded CSS by hand (back in like 2010), and for placeholders, I used the simple colors I knew, like "green" or "blue". And "red", of course, too. But when typing "re" for "red", I noticed that it autocompletes to "rebeccapurple", which amused me, since I thought it's kind of a nonsense to have a color named like that. Over time, I used it a lot, and it became a kind of a favorite of mine.
Without even judging the overall design (personally I don't mind the simplicity), why on earth do they use such inconsistent fonts? 3 different font sizes (and maybe also mismatching horizontal spacings) for 5 assorted logos??? This is insane...
Because they are still logos, not one list of short acronyms that just happens to be rendered in a specific way?
I really think it's fine: the web assembly gets to play with its parallels between W and A, JS gets to mirror the J's bottom-bend in its S (TS tagging along because those two really are more than just accidental neighbors), whereas CSS can indulge in summetry with its twin S by making them internally symmetric themselves. A logo that contains an acronym isn't really a logo when the characters are just picked from some font instead of tailored as part of the logo.
You want them to be even less distinctive? Personally, I think they should lean into that more and embrace the context: e.g. sans-serif for CSS, monospace for JS, serif for HTML.
Why does it include TS? I would never have called it a 'web technology'. A lot of people use it in their tech stack, but fortunately, the browser does not even understand it, right?
Most CSS color names were inherited from the X11 color list [1], which, in turn, sourced its colors from a weird mixture of Crayola crayons, paint samples, and idiosyncratic personal choices [2]. It's a mess.
> Update 22 Jun 14: the proposal was approved by the CSS WG and added to the CSS4 Colors module. Patches to web browsers have already happened in nightly builds. (I’m just now catching up on this after the unexpected death of Kat’s father early Saturday morning.)
Mr. Meyer certainly had a rough 2014.
Kudos to him and all his CSS contributions over the years. I hope he has been able to find some solace since then.
And I can't blame him. They say no parent should see their child die, and that's certainly true; but especially no parent should see their 6 year old child die of brain cancer. Humans are not built to withstand that.
I am in a train and I stopped reading because I was crying too much. The fact that the reminder of this story hides in plain sight, in the form of a named CSS color, makes it even more touching for some reason.
I think we're stretching the definition of "logos" here. Just sticking text in a square doesn't make it a true logo.
Think of Apple or Nike, those are real logos. The recent logos and icons, including apps like Photoshop's, seem more like we're prioritizing metrics over creativity.
What about those of IBM, Facebook, Google, Netflix, or Uber? They're just words, with gentle stylization. Sometimes their logos take on the shape of a single letter in a box, which by your standards might even be less creative.
But there are reasons for this. Plain wordmarks are high-contrast and easy to read almost by default, and they work great with groups that aren't already aware of your brand. Or as Netflix puts it (https://brand.netflix.com/en/assets/logos/),
> The Wordmark remains an essential identifier of our brand. While our goal is to lead with the N Symbol, we enlist the Wordmark to ensure brand recognition in low-awareness markets or when production limits the use of color.
CSS doesn't have a ton of brand awareness. Making something akin to the Nike Swoosh for CSS won't catch on, it's not like they have the money to flood your Instagram feed with it and force that brand recognition on you.
Going back to Netflix why would they use a single gently stylized letter where possible? Well,
> In high-awareness markets, we lead with the N Symbol. There is power in owning a letter of the alphabet: it’s universal and instantly identifiable as shorthand for our brand.
That's right. Netflix wants to own the letter N. I think "CSS" is in the same position: owning a combination of three letters is a power move. That's the most valuable thing about the "CSS brand," if ever there were one, so why not lead with it?
But maybe your opinion is still that all of these designers are full of it (apparently including Paul Rand).
> The color was originally going to be called beccapurple, but Meyer asked that it instead be named rebeccapurple, as his daughter had wanted to be called Rebecca once she had turned six. She had said that Becca was a "baby name," and that once she had turned six, she wanted to be called Rebecca. As Eric Meyer put it, "She made it to six. For almost twelve hours, she was six. So Rebecca it is and must be."
Wasn't expecting tears over a colour
..in 2014 in honor of Eric Meyer's daughter, Rebecca, who passed away at the age of six on her birthday from brain cancer.
Eric Meyer's posts about his daughter's illness, and the family's lifelong process of grieving afterward, are heartbreaking. It's arresting, gripping writing. It's wonderful and awful. Hug your loved ones tight. https://meyerweb.com/eric/thoughts/category/personal/rebecca...
Thank you for linking this. I read bits and pieces of this as it was happening but it never fully registered for me at 24. I'm sitting here 10 years later at 34 having lost our son at 23 weeks. His due date was this past week. It's affected me in ways that still surprise, befuddle, and sometimes scare me. I cannot even begin to fathom what he's been through; the most recent blog post has me in tears.
I have really strong memories of learning HTML, CSS, and javascript in high school, and spending time in the school library picking apart css/edge. It felt like the dawn of a new era, I was in awe of the things I saw there. I built more than a few sites trying to get my head around the complexispiral demo, and spent countless hours diving into resources I found there (like A List Apart! I will never forget the suckerfish drop-downs). This is one of the few moments I have such vivid memories of that were directly responsible me for pursuing computer engineering and ultimately going so far into UI/UX and the web. I've never written it out this explicitly but: thank you for everything, Eric.
I'm so sorry to hear this. Dealing with this is much harder than most young people or non-parents would expect.
After successfully conceiving our first son through IVF on the first attempt, my wife and I experienced a failed IVF cycle this year while trying for a second child. This time, the embryo had been implanted, but it did not survive beyond two weeks. I thought I would be able to handle a failed IVF attempt more easily, knowing how statistically common it is. Yet, even just experiencing that was devastating.
I can’t imagine the pain of losing a child at 23 weeks, experiencing a miscarriage, or facing loss later on. Reading about the background of this color name brought tears to my eyes.
Thank you for sharing, Eric. It’s been a few years now for me since we lost our son before I ever had the chance to meet him and I’m not sure it’s any easier. Stories like yours and that of others help us all know we’re not alone in our grief though so I encourage you to keep sharing and telling your story.
I hope every day is a bit easier than the last for you.
Ouch. As a father, that was a gutpunch. Dark, haunting, dripping with grief and pain, but beautifully written and very haunting.
I can’t imagine anything worse than what that guy has been through.
I’m holding my sleeping baby as I write this and I just hugged him even tighter. Thanks for sharing.
Having never had children myself, his writing moved me in a way that I struggle to comprehend. I spent my 2 hour commute reading through all of his writing on his time, and subsequent grief of his daughter, starting here: https://meyerweb.com/eric/thoughts/2008/06/18/welcome-2/
I found this piece particularly moving, and brought me to tears:
https://meyerweb.com/eric/thoughts/2014/06/10/so-many-nevers...
How can the game be so unfair for some? People don’t deserve this.
Makes you think how life so easily and randomly can be so different irrespective of who you are or what you do to affect you forever.
"wonderful and awful" is such a brilliant way to capture this. Thank you
Those posts are definitely not for everyone. It is a deep dive into the emotions of a grieving father for over a decade.
I really hope that man can find peace.
I really don’t like these logos that are boxes with text in the lower right. The post cites a “common design language” with other tech but this has to be the most low effort language imaginable.
They could've added some character by letting the text overflow the box :)
The rounded corners was a suitable reference to css, I think.
You prefer these?
https://en.wikipedia.org/wiki/HTML5#/media/File:HTML5_logo_a... https://en.wikipedia.org/wiki/File:CSS3_logo_and_wordmark.sv...
Not who you are replying to, but I started learning HTML/CSS right when HTML5 and CSS3 had just come out, so I do have somewhat of a soft spot for these
Absolutely prefer these
Yes.
Is this the only choice we have?
Yes.
They are certainly more colorblind and vision impairment friendly to be honest.
What is color blind unfriendly about the new logos precisely? Which variant of color blindness will not be able to read them?
Which visual impairment exactly will find it easier to parse the previous logos (which are a mess of design scarcely related to the actual technology name) than the current ones, which contain thick bold text indicating exactly what the technology is called?
They're so much nicer.
They remind me way too much of dark-arts virus checker, disk cleaner BS.
Disagree, but then again my soulless engineer's heart has close to zero tolerance for design for design's sake, so what do I know?
The most important part about convoying that an item is CSS is including the letters CSS. So while I am a little disgusted they wasted time on an icon at all, I will admit that many of our design language structures demand an icon. So I am somewhat relieved they managed to dodge the design for design's sake crowd and picked the best possible one. A non-descript box with the letters CSS in it.
"Non-descript" is unfair - it has 3 rounded corners!
I think Adobe started this trend. A box with "Ps" inside for Photoshop, "Lr" for Lightroom, etc. for all their products.
An entire generation of web designers grew up with their heads stuck in the Adobe ecosystem, so this must look like the gold standard to them.
At least Adobe made an effort to make their logos look like symbols on the periodic table.
To me these made sense, as I was able to quickly, visually distinguish PhotoShop by the “PS” letters instead of trying to decipher a 32x32 logo.
They should have centered the text in it both vertically and horizontally
It's impossible to do that with CSS :)
Could've used this classic CSS joke as the logo https://i.etsystatic.com/21468781/r/il/426363/2712010149/il_...
the design language is really "keep it inside the box, don't worry about your self-imposed solution constraints"
You're absolutely right, especially considering the canonical CSS-in-a-box logo has long been established [1], and they should really embrace it if they had any sense of humor.
Perhaps those brutalist logos were designed specifically such that they could be rendered using CSS itself? Though I could understand why they'd want to distance themselves from the old "shield" logo that turned out to signify shielding "browser vendors" from broad implementation of CSS renderers and to keep a niche of job security at W3C, Inc. due to rampant and unwarranted complexity, but in any case was burnt by being placed next to vulgar metalhand vectors, not to speak of being culturally discriminative when viewed in a "woke" interpretation.
[1]: https://ih0.redbubble.net/image.13378023.4114/raf,750x1000,0...
> especially considering the canonical CSS-in-a-box logo has long been established
Is this a joke? I’ve never seen it in my life, not even sure where you’re pulling it from
Related. Others?
Adding 'rebeccapurple' color to CSS Color Level 4 (2014) - https://news.ycombinator.com/item?id=34186932 - Dec 2022 (1 comment)
Adding 'rebeccapurple' color to CSS Color Level 4 (2014) - https://news.ycombinator.com/item?id=9565503 - May 2015 (33 comments)
Adding 'rebeccapurple' color to CSS Color Level 4 - https://news.ycombinator.com/item?id=7924677 - June 2014 (25 comments)
In memory of Rebecca Alison Meyer - https://news.ycombinator.com/item?id=7863890 - June 2014 (68 comments)
An official logo for CSS - https://news.ycombinator.com/item?id=42124786 - November 2024
I will never ever forget this color name and the story behind it for the rest of my life.
It’ll be interesting to see where we end up using this. I don’t honestly see the CSS3 shield this is meant to replace very often anymore.
Probably the place where it’ll be seen the most is in IDE file trees, where I’m a bit worried it’ll just look like a little purple blob
File Browser / Finder maybe, but the text inside the boxes are too small for IDE file trees.
VS Code shows "JS" in yellow text without the box, against a dark background. CSS is just a blue hash symbol. Maybe they'll change the color to rebeccapurple, but I don't think there's room for a box around the symbol.
I used rebeccapurple a lot as well, unknowing of the touching story behind it. I coded CSS by hand (back in like 2010), and for placeholders, I used the simple colors I knew, like "green" or "blue". And "red", of course, too. But when typing "re" for "red", I noticed that it autocompletes to "rebeccapurple", which amused me, since I thought it's kind of a nonsense to have a color named like that. Over time, I used it a lot, and it became a kind of a favorite of mine.
Is there any link that explains why this particular shade of purple was chosen to represent Rebecca?
https://github.com/vic/rebecca-theme I thought it derrives from this.
Haha
For some reason, I was under the impression that the blue shield was the css logo.
But after looking at it, I realized that it was just for CSS 3 and I'm not sure if it was even official?
Without even judging the overall design (personally I don't mind the simplicity), why on earth do they use such inconsistent fonts? 3 different font sizes (and maybe also mismatching horizontal spacings) for 5 assorted logos??? This is insane...
Because they are still logos, not one list of short acronyms that just happens to be rendered in a specific way?
I really think it's fine: the web assembly gets to play with its parallels between W and A, JS gets to mirror the J's bottom-bend in its S (TS tagging along because those two really are more than just accidental neighbors), whereas CSS can indulge in summetry with its twin S by making them internally symmetric themselves. A logo that contains an acronym isn't really a logo when the characters are just picked from some font instead of tailored as part of the logo.
You want them to be even less distinctive? Personally, I think they should lean into that more and embrace the context: e.g. sans-serif for CSS, monospace for JS, serif for HTML.
It's incredibly ironic
The bar for a logo has become so low. I don't understand how we reached here and everyone are happy about it.
>The design follows the design language of the logos of other web technologies like JavaScript, TypeScript, and WebAssembly.
and yet it's 5 logos with 3 different font sizes and at least 3 different font faces
3 of which are perfect rectangles, and 2 of which are slight variations on rectangles
i guess it perfectly represents the ecosystem, no notes
To fully represent HTML, they should be displayed with sightly different fonts and kerning in each operating system.
This is the evolution of "Design by committee" to "Design by 3 committees"
Why does it include TS? I would never have called it a 'web technology'. A lot of people use it in their tech stack, but fortunately, the browser does not even understand it, right?
GNU Rebecca Meyer
It's a nice purple.
A simple one too - it would be on a 216 colour pallete using six values for each of R, G and B.
R = 1/5
G = 2/5
B = 3/5
Edit: of course that makes sense it is probably a "web safe" one
If it's such a simple combination, I wonder why it wasn't officially named until 2014. CSS has had names for all sorts of weird colors since forever.
Most CSS color names were inherited from the X11 color list [1], which, in turn, sourced its colors from a weird mixture of Crayola crayons, paint samples, and idiosyncratic personal choices [2]. It's a mess.
[1]: https://gitlab.freedesktop.org/xorg/xserver/-/blob/master/di...
[2]: https://lists.w3.org/Archives/Public/www-style/2014Mar/0272....
Maybe it wasn’t named so that long after people like me pass from memory for good, people will still speak of Rebecca and of the love we showed her.
> Update 22 Jun 14: the proposal was approved by the CSS WG and added to the CSS4 Colors module. Patches to web browsers have already happened in nightly builds. (I’m just now catching up on this after the unexpected death of Kat’s father early Saturday morning.)
Mr. Meyer certainly had a rough 2014.
Kudos to him and all his CSS contributions over the years. I hope he has been able to find some solace since then.
I would say he hasn't, considering a few months ago he wrote "A Decade Later, A Decade Lost" https://meyerweb.com/eric/thoughts/2024/06/07/a-decade-later...
And I can't blame him. They say no parent should see their child die, and that's certainly true; but especially no parent should see their 6 year old child die of brain cancer. Humans are not built to withstand that.
<3
This would have been quite funny instead:
https://ih1.redbubble.net/image.1851735303.3881/flat,750x,07...
I didn't expect a logo update to bring tears to my eyes.
I am in a train and I stopped reading because I was crying too much. The fact that the reminder of this story hides in plain sight, in the form of a named CSS color, makes it even more touching for some reason.
I think we're stretching the definition of "logos" here. Just sticking text in a square doesn't make it a true logo.
Think of Apple or Nike, those are real logos. The recent logos and icons, including apps like Photoshop's, seem more like we're prioritizing metrics over creativity.
What about those of IBM, Facebook, Google, Netflix, or Uber? They're just words, with gentle stylization. Sometimes their logos take on the shape of a single letter in a box, which by your standards might even be less creative.
But there are reasons for this. Plain wordmarks are high-contrast and easy to read almost by default, and they work great with groups that aren't already aware of your brand. Or as Netflix puts it (https://brand.netflix.com/en/assets/logos/),
> The Wordmark remains an essential identifier of our brand. While our goal is to lead with the N Symbol, we enlist the Wordmark to ensure brand recognition in low-awareness markets or when production limits the use of color.
CSS doesn't have a ton of brand awareness. Making something akin to the Nike Swoosh for CSS won't catch on, it's not like they have the money to flood your Instagram feed with it and force that brand recognition on you.
Going back to Netflix why would they use a single gently stylized letter where possible? Well,
> In high-awareness markets, we lead with the N Symbol. There is power in owning a letter of the alphabet: it’s universal and instantly identifiable as shorthand for our brand.
That's right. Netflix wants to own the letter N. I think "CSS" is in the same position: owning a combination of three letters is a power move. That's the most valuable thing about the "CSS brand," if ever there were one, so why not lead with it?
But maybe your opinion is still that all of these designers are full of it (apparently including Paul Rand).
This is definitely a logo, by all definitions of the word. It’s not just "text in a box", it’s:
- text, with a specific font, position, size, weight
- a specific color
- a box radius in 3 corners
- some variants
By your definition, the Coca Cola logo is not a logo because it’s "just text"
Tell Gap (and all the rest).