Art deco web design: geometry, symmetry and gold on dark, used with restraint
Art Deco's look comes from geometry, not decoration piled on: strong verticals, stepped and fanned shapes, symmetry, tall geometric type and metallic accents on dark grounds. On the web it works best as structure (a centred layout, a fine gold rule, generous tracking on capitals) with ornament used once or twice, not on every card.
Where Art Deco comes from
Art Deco is the style of the 1920s and 1930s in architecture, furniture, posters, jewellery and type. The 1925 Exposition Internationale des Arts Décoratifs et Industriels Modernes in Paris is usually treated as its turning point. The name itself came much later: as the V&A's introduction to Art Deco explains, the term was coined in the 1960s, and at the time the style was called Style Moderne, with labels like Jazz Moderne and Zigzag Moderne used in Britain and America.
It was eclectic by nature. The V&A traces its sources to Art Nouveau's plant forms made more geometric, to the avant-garde movements of the period such as Cubism and Futurism, and to Egyptian motifs popular after the excavation of Tutankhamun's tomb. What holds it together is a balance the museum describes between tradition and modernity, and between luxury and function.
The traits that make it read as Deco
- Geometry
- Stepped outlines like a skyscraper's setbacks, sunbursts and fans, chevrons, concentric arcs, and strong vertical lines.
- Symmetry
- Centred compositions with a clear axis. Deco rarely does the off-centre asymmetry of modernist layouts.
- Type
- Tall, geometric capitals with high contrast between thick and thin, or clean geometric sans-serifs; wide letter-spacing on small capitals.
- Colour
- Black, deep green, navy or burgundy grounds with gold, brass, silver or cream; occasional jade or coral.
- Materials
- The look of lacquer, chrome, inlaid wood and glass, which on screen means flat rich colour and fine metallic lines rather than textures.
Art deco typography on the web
Display faces drawn in the Deco manner are often too decorative for anything but a logo or a single headline, and many are hard to read below 40px. A safer route is a geometric sans-serif of the period's spirit for everything, with the Deco character coming from how it's set: light or medium weights at large sizes, capitals with generous tracking for labels and navigation, and centred headings. Futura, designed by Paul Renner in 1927, is the classic reference. Jost, a free family on Google Fonts, was drawn to keep "the attitude of Futura rather than the exact design", in the words of its designer's page.
- Use one family. A Deco display face plus a geometric body face plus a script is a costume, not a style.
- Keep body text in normal case at 17px or more; tracked capitals are for short labels only.
- Don't set long passages centred, even on a symmetrical page. Centre the column, left-align the text inside it.
Getting Deco without the clutter
- Make the structure symmetrical. A centred hero, a centred section heading and an even grid of two or four do more than any ornament.
- Use one fine metallic line as the recurring device: a 1px gold rule under headings, around a pricing panel or framing a photo.
- Add a single geometric motif, such as a fan or stepped corner drawn in CSS or SVG, at one or two key points, not every card.
- Go dark, but not black on black. A deep ground with cream text and gold accents; check the gold on dark meets contrast for any text, since mid-tone golds often don't.
- Choose photography in the spirit: architecture, interiors, objects with strong lines, warm light.
- Keep motion slow or absent. The period's glamour is static; spinning sunbursts undercut it.
Deco suits cocktail bars, hotels, jewellers, perfume and fashion houses, theatres, cinemas and event venues with history. It's a poor fit for a clinic or an app that needs to look current and plain. For related approaches, see luxury web design and the industry guide for cocktail bars.
Art Deco in Anticode
Anticode doesn't have an Art Deco design system. The closest is Luxury: it uses Jost, the geometric family modelled on Futura's attitude, with light display headlines, wide-tracked capitals for navigation, buttons and small facts, square corners, and a champagne-on-black palette. Its Auto theme is already dark. Choose gold as the action colour in the visual editor and the buttons and fine rules pick it up. Maison Ardent, the perfume house in the template gallery, shows a related luxury look, though templates are app builds written by Anticode's model rather than pages in one of the seven systems.
Questions people ask
What are the main features of Art Deco design?
Geometric shapes such as fans, chevrons and stepped outlines, symmetry, tall geometric type, and metallic accents on dark or rich grounds.
What fonts look Art Deco?
Geometric sans-serifs in the Futura tradition give a restrained version; Deco display faces give a stronger one but should be limited to headlines or a logo.
Is Art Deco good for a luxury brand website?
It can be, particularly for hospitality, jewellery, perfume and venues. Keep ornament sparing and the text readable.