The Stroop effect, the gradient, and why this website looks the way it does.
A 1935 psychology experiment by John Ridley Stroop is the reason the gradient text on this site exists. Here’s the science behind one of the most replicated findings in cognitive psychology — and how it quietly shaped my approach to WordPress web design, development and SEO.
Contents
1935, George Peabody College for Teachers
The first time I encountered the Stroop effect, I was an undergraduate psychology student halfway through my second year. The lecturer projected a slide of colour words — RED, BLUE, GREEN, YELLOW — each printed in a colour that didn’t match the word. The instruction was simple: name the ink colour, not the word.
Nobody in the room could do it at speed. We stumbled, hesitated, corrected ourselves. The reading brain was so automatic, so deeply trained, that suppressing it took measurable cognitive effort.
What we’d just experienced was the Stroop effect, first documented by John Ridley Stroop in 1935 at George Peabody College for Teachers in Nashville. His doctoral dissertation, Studies of interference in serial verbal reactions, published in the Journal of Experimental Psychology, became one of the most cited papers in cognitive psychology — by some counts, the most-cited paper in the field of attention research.[1]
What Stroop actually measured
Stroop ran three experiments. The most famous one — Experiment 2 — used 100 participants drawn from undergraduate psychology classes. Each completed two tasks: reading a list of 100 colour names printed in black ink (Task A), and naming the ink colour of 100 conflicting colour words (Task B, e.g. the word “RED” printed in blue).
The numbers are striking. Task A averaged 63.3 seconds. Task B averaged 110.3 seconds — a 74% slowdown simply because the brain had to suppress its automatic reading response.[1]
Subsequent neuroimaging work in the 1990s by Pardo and colleagues localised this interference to the anterior cingulate cortex, a region heavily involved in cognitive control and conflict monitoring. The Stroop task is now standard in clinical neuropsychology, used to assess attention, executive function, and damage to frontal-lobe regions.[2]
The mind reads automatically. Asking it to stop reading is one of the costliest cognitive demands we know of.
Try the Stroop test yourself
Below is a working Stroop test, embedded in this post. Six trials — three congruent (where the word matches the ink colour) and three incongruent (where they conflict). Your reaction time is measured on each trial and your personal Stroop interference is shown at the end.
Name the ink colour, not the word
When the word appears, click the button matching the colour of the ink, not what the word says. Six trials, takes about 30 seconds.
Why this site uses gradient text
The Stroop effect taught me something useful about the visual brain: colour carries meaning independently of words, and the two channels compete. Designers ignore this at their peril.
When I rebuilt the danelian designs homepage, I wanted certain phrases to feel weightier than others — not just visually emphasised but cognitively distinct. The aurora gradient on phrases like “SEO that earns its keep” and “beats off-the-shelf themes” isn’t decoration. It uses colour as a parallel meaning-channel, the same one Stroop’s experiment proved is impossible to ignore.
Used sparingly, gradient text functions as a visual pull-quote. Used carelessly — on every other word — it produces the same overload as Stroop’s incongruent trials. The cognitive cost of disagreement between channels is real, and it’s why the gradient on this site appears on roughly one phrase per heading, not on every emphasised word.
Psychology in WordPress web design and SEO
Psychology threads through every choice on a well-designed WordPress site, not just typography. A few that I use deliberately:
- Cognitive load — the fewer elements on a page, the faster a visitor decides what to do. Custom WordPress builds win here because they ship only what’s used; off-the-shelf themes bury the action behind decoration.
- Fitts’s Law — larger, closer click targets are reached faster. The “Book a call” button in the nav is intentionally pill-shaped and aurora-filled; it’s the easiest button to hit on the page.
- The Von Restorff effect — the isolation effect, where one distinct item in a list is remembered better than the rest. This is exactly what the gradient phrases do on the homepage.
- Reading patterns — the F-pattern eye-track on text-heavy pages, the Z-pattern on landing pages. Headlines, CTAs and gradient highlights are positioned where the eye lands first, not where the grid feels balanced.
- SEO and dual coding — clear hierarchy (H1, H2, H3), descriptive alt text, and semantic HTML aren’t just for Google. They reflect how humans skim content. Search engines reward what helps people read.
Good WordPress web design is rarely about aesthetics in isolation. It’s about understanding how a human mind processes a page — and removing every barrier between landing and acting.
References
Cited research
- Stroop, J. R. (1935). Studies of interference in serial verbal reactions. Journal of Experimental Psychology, 18(6), 643–662.
- Pardo, J. V., Pardo, P. J., Janer, K. W., & Raichle, M. E. (1990). The anterior cingulate cortex mediates processing selection in the Stroop attentional conflict paradigm. Proceedings of the National Academy of Sciences, 87(1), 256–259.
- MacLeod, C. M. (1991). Half a century of research on the Stroop effect: An integrative review. Psychological Bulletin, 109(2), 163–203.
Frequently asked
What is the Stroop effect in simple terms?
How does psychology relate to WordPress web design?
Why use gradient text on a website?
Does Google penalise gradient text or decorative typography?
background-clip: text is fully indexable by Google. The text content is what matters for SEO, not the visual treatment.