The “Hidden” Purple Memorial in Your Web Browser

Victor Algaze
Apr 5, 2017 · 3 min read
#663399 // “rebeccapurple”

I recently encountered a visual bug where the style I was attempting to apply to an SVG element just wasn’t working. My first instinct when debugging a tricky styling issue is to fire up Chrome Dev Tools and attempt a sanity-test. I usually start by setting the misbehaving element to a noisy and ugly CSS color value like ‘blue’ or ‘red’ and examine any clues.

To my surprise, when I typed the first two letters of “red” — just “re” — the element was filled with purple. Was “re” some type of new obscure shorthand?

It turns out that Chrome Dev Tools was autcompleting “re” to a named CSS color I had never encountered before. The color was named “rebeccapurple

“re” is purple??

What’s rebeccapurple?

That autocomplete behavior led to me to learn about a tiny gesture of kindness/remembrance that is baked in to every major web browser and has been part of the official CSS standard since 2014.

Purple was the favorite color of Rebecca Alison Meyer who passed away twelve hours into her sixth birthday from brain cancer. Rebecca was the daughter of prolific CSS standards pioneer Eric Meyer. Eric kept his online colleagues informed of the battle his daughter and family were waging through blog posts and brief updates on Twitter.

After hearing the awful news, designer/author Jeffrey Zeldman decided to do something and started a Twitter hashtag campaign in her memory:

What started as a hashtag charity campaign evidently transformed into a much larger project. Given Eric’s prolific work on CSS, it was proposed that the hex-value #663399, a shade of purple, be aliased to “beccapurple.”

When informed of the initiative, Eric had one request if the standards body were to adopt the proposal: call it “rebeccapurple” instead. Eric writes thatRebecca informed us that she was about to be a big girl of six years old, and Becca was a baby name. Once she turned six, she wanted everyone (not just me) to call her Rebecca, not Becca.”

In late June 2014 the proposal was finalized and “rebeccapurple” was now officially the color purple with a hex value of #663399.

See 6:30

I sure didn’t expect a silly CSS problem to reveal so much kindness.

If nothing else, the next time you find yourself trying to pick a color or debug a fussy element, how about “rebeccapurple”?

Further Reading:

Victor Algaze

Written by

Software engineer/sloganeer