← back to the index

web brutalism.

last-modified: 2026-05-12 14:23 UTC
content-type: text/html; charset=utf-8
content-length: 14336 bytes
word-count: 2,140
author: phil bennett <phil@metisio.com>
school: 03 of 08
view-source: encouraged. no minification. no transpilation. no framework.
javascript: 0 bytes.
stylesheet: 14 lines, scoped above.
images: 0.

contents.

1. what it is.
2. what it is not.
3. history.
4. before and after: vercel.
5. archive. further reading.
6. rules of the school.
7. references.

what it is. §1 · 240 words · last edited 2026-05-12

web brutalism is the school of refusal. it emerged on the web around 2014 to 2016, after the second wave of saas startups had finished sanding every corner of every webpage. brutalistwebsites.com — curated by pascal deville from 2014 onward — was the canon.

the position is simple. stop fighting the browser. the browser already knows how to render a paragraph. it knows how to render a heading. it knows how to render a list. when you override these defaults with frameworks and design systems and tailwind classes, you are not designing. you are translating the browser's already-good defaults into something more expensive and less reliable.

web brutalism says: stop. let the browser do it. add a stylesheet only when the browser is wrong.

most of the time the browser is not wrong.

what it is not. §2 · 110 words

web brutalism is not "ugly on purpose." that is the most common misreading. true web brutalism is not ugly at all — it is what HTML looks like when you trust it. that takes restraint.

web brutalism is also not the same as lacquer. lacquer uses brutalism as its structural skeleton and then puts memphis decoration on top of it. pure web brutalism does not add the memphis layer. lacquer is "brutalism dressed in memphis." web brutalism is brutalism naked.

don't confuse them. picking this school means removing the decoration layer entirely.

history. §3 · 320 words · cites 5 external

the term "brutalism" comes from the post-war architecture movement that started in europe in the 1950s. béton brut, raw concrete. the architects were le corbusier, alison and peter smithson, paul rudolph. their buildings were unfinished-looking on the outside. the materials of construction (concrete forms, exposed brick, steel I-beams) became the surface. nothing was hidden.

when the word migrated to the web around 2010 it kept that meaning. raw HTML is the equivalent of raw concrete. browser defaults are the equivalent of unfinished beams. the page does not pretend to be made of something it is not.

by 2014 a small movement had formed around the position. pascal deville started brutalistwebsites.com. tim berners-lee was sometimes cited approvingly (his early CERN pages are pure pre-design HTML). some early sites in the movement: bloomberg's terminal-era index, craigslist.org (which had never stopped being brutalist), the personal homepages of certain academics who had never updated since 1997.

the movement was always small. its commercial penetration was always near-zero. its influence was outsized. neubrutalism — see school 04 — is the laundered descendant. it kept the borders and the no-radius and lost the refusal.

before and after: vercel. §4 · two artifacts

vercel.com is the platonic case of "designed by people who would not be caught dead writing CSS by hand." every gradient is engineered. every animation is timed. the home page is a recruiting tool for frontend engineers who want to write more javascript. it is the present-day antagonist of web brutalism.

now the same homepage, in web brutalism. no css block. no gradient text. no images. no rounded corners. no shadow. one stylesheet. it took six lines.

both are vercel. one is a recruiting funnel. the other is a webpage.

archive. further reading. §5 · 14 references

brutalist web design has a small written canon and a larger oral history. the published references below are the ones worth your time. the rest can be reconstructed by reading the linked pages and their links.

the canon.

the architecture parent.

web brutalism inherits its name and ethics from the post-war architecture movement that ran from about 1950 to 1975 in europe and north america. the term brutalism comes from french béton brut — raw concrete. le corbusier coined it. the smithsons in london (alison and peter smithson) articulated the ethic in their 1953 essay "the new brutalism." reyner banham wrote the definitive book in 1966.

printed references.

• "The New Brutalism: Ethic or Aesthetic?" — Reyner Banham. architectural press, 1966. the founding text of the architecture movement.
• "Concrete Atlantis" — Reyner Banham, MIT press, 1986. on the origins of brutalist surface treatment in american factories.
• "Brutal: Photographs of the World's Most Confrontational Buildings" — Peter Chadwick. prestel, 2016. accessible photo survey.
• "Brutalist Web Design Handbook" — David Bryant Copeland, online, 2014. an essay-length manifesto.
• "This Is Service Design Doing" — Stickdorn et al., o'reilly 2018. not a brutalism book, but its production aesthetic shows the influence.

history of the web version.

the term web brutalism was coined around 2014. pascal deville started brutalistwebsites.com on march 28 of that year. the position became visible in design discourse through articles in smashing magazine, the verge, and fast company over the following two years. by 2017 the term had entered the standard vocabulary of web design schools, where it is now sometimes taught as a unit on the bachelor's curriculum.

the second wave (2018–2020) lost the refusal and kept the visual moves. that became neubrutalism — see school 04, for the long version of how the laundering happened.

rules of the school. §6 · 10 items

• no webfonts.
• no border-radius.
• no shadows of any kind.
• no transitions, animations, or gradients (not even hard-stop).
• no SVG decoration. no memphis motifs.
• one photograph per page, maximum. untreated.
• file metadata visible: dates, content-type, sometimes file size.
• view-source should be readable. no minified output. no inline comments larger than the content.
• functional things use browser-default <button> and <input>. the OS chrome is fine.
• stylesheet under 30 lines for a real brutalist page.

when to reach for it.

archives. indexes. documentation that wants to feel like a manual. about pages for projects that take themselves seriously. portfolios where the work is loud and the page should recede. developer-facing tools.

not for: consumer products. e-commerce. marketing landing pages where conversion matters. anywhere the audience will read "looks plain" as "is broken."

references. §7

← back to the index.   web brutalism. school 03 of 08. raw html against the corporate web.