Finishing touches
The things people notice without being able to name them — what sits behind your words, the border that catches the light, the button worth pressing. None of it is necessary and all of it is cheap; most sites use two or three and leave the rest.
Everything here takes your colours, not the ones shown, and anything marked “moves” stops automatically for visitors who have asked their device to reduce motion.
What sits behind your words
A plain white page is a choice, and usually not the best one. Fine textures, washes of colour, a wave along the foot of a section — each shown behind the same concert listing so you can judge them against each other rather than in the abstract.
On a light page
Fine textures
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Colour washes
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
With movement
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Shapes and scenery
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Any of these can be redrawn
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
On a dark page
Fine textures
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Colour washes
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
With movement
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Shapes and scenery
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Any of these can be redrawn
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Saturday 14 March · 7.30pm
Brahms & Caroline Shaw
St Cecilia’s Hall
Detail on the page itself
Borders, buttons, headline treatments and the small moments of depth that make a page feel finished rather than assembled.
On a light page
Cards and panels
A light travelling around the edgemoves
A soft glow behind the card
Buttons
A sheen that crosses the buttonmoves
A colourful glowmoves
The label changes as you point at ithover or tab to it
A key with real heightpress and hold it
Colour flooding out from the middlehover or tab to it
Colour sweeping in from the lefthover or tab to it
An outline that steps away as you pointhover or tab to it
A technical grid that scanshover or tab to it
Frosted glass
Headlines
Colour moving through the lettersmoves
Nineteen summers of chamber music
A printed, offset shadow
Season Nineteen
Outlined, like a poster
Season Nineteen
A picture showing through the letters
Words around a circlemoves
In the text
A neon sign with a faultmoves
Letters thickening under the cursorrun along the word
Words rolling past, blurred in transitmoves
A highlighter drawn under a phrasethe second one draws as you point at it
Auditions are open until 1 September, and places are limited.
Progress and depth
How full a concert is
Text softening as it runs off the edgescroll the panel
Applications for the nineteenth season open on the first of September and close at the end of the month. Recordings must be submitted unedited. Recommenders are contacted automatically once a submission is complete, and the panel meets in early November.
Pieces circling a centremoves
On a dark page
Cards and panels
A light travelling around the edgemoves
A soft glow behind the card
Buttons
A sheen that crosses the buttonmoves
A colourful glowmoves
The label changes as you point at ithover or tab to it
A key with real heightpress and hold it
Colour flooding out from the middlehover or tab to it
Colour sweeping in from the lefthover or tab to it
An outline that steps away as you pointhover or tab to it
A technical grid that scanshover or tab to it
Frosted glass
Headlines
Colour moving through the lettersmoves
Nineteen summers of chamber music
A printed, offset shadow
Season Nineteen
Outlined, like a poster
Season Nineteen
A picture showing through the letters
Words around a circlemoves
In the text
A neon sign with a faultmoves
Letters thickening under the cursorrun along the word
Words rolling past, blurred in transitmoves
A highlighter drawn under a phrasethe second one draws as you point at it
Auditions are open until 1 September, and places are limited.
Progress and depth
How full a concert is
Text softening as it runs off the edgescroll the panel
Applications for the nineteenth season open on the first of September and close at the end of the month. Recordings must be submitted unedited. Recommenders are contacted automatically once a submission is complete, and the panel meets in early November.
Pieces circling a centremoves
A control panel
For the parts of a site that are equipment rather than reading — a live board, a player, a seat map. It brings its own colours; these are not the page's.
Now rehearsing
Brahms, Op. 51 no. 1 — second movement. Strings only.
Text you pull into focus
These follow your scrolling rather than a timer — scroll slowly and they resolve at exactly your pace, and stop when you stop.
Built with intention
A festival is a year of work and one week of music.
And some made only for music
Staves, level meters, ticket stubs, printed textures. Most website toolkits are built for software companies and adapted afterwards; these were drawn for concert programmes and box offices. If one of them fits your organisation, say so.
On a light page
Made for music
Live indicator
Moving level bars — marks a concert that is streaming now.
Stave
Five hairlines as a background texture or a section divider.
Stave drawing in
The same lines, ruled across the page as you arrive.
Metronome
A ticking pendulum. Good beside a rehearsal schedule.
Record
A turning disc for a recordings page or a now-playing marker.
Waveform
An audio signature — beside a track listing or a sound clip.
Panels and cards
Frosted panel
Translucent, blurring whatever sits behind it.
Ticket
A punched stub, for box-office cards and passes.
Printed texture
Halftone dots — suits a historic programme or archive page.
Torn edge
A perforated rule between sections.
Type treatments
Outlined
Hollow display type. Strong on a photograph.
Winter Season
Pressed
Type impressed into the surface, like letterpress.
Nineteen summers
Centre rule
A line that grows outward under a heading.
Programme
Appearing and disappearing
Panel that opens
Slides in when opened and back out when closed — try it twice.
Reading progress
A bar that fills as a visitor moves down a long page.
Scroll this box.
On a dark page
Made for music
Live indicator
Moving level bars — marks a concert that is streaming now.
Stave
Five hairlines as a background texture or a section divider.
Stave drawing in
The same lines, ruled across the page as you arrive.
Metronome
A ticking pendulum. Good beside a rehearsal schedule.
Record
A turning disc for a recordings page or a now-playing marker.
Waveform
An audio signature — beside a track listing or a sound clip.
Panels and cards
Frosted panel
Translucent, blurring whatever sits behind it.
Ticket
A punched stub, for box-office cards and passes.
Printed texture
Halftone dots — suits a historic programme or archive page.
Torn edge
A perforated rule between sections.
Type treatments
Outlined
Hollow display type. Strong on a photograph.
Winter Season
Pressed
Type impressed into the surface, like letterpress.
Nineteen summers
Centre rule
A line that grows outward under a heading.
Programme
Appearing and disappearing
Panel that opens
Slides in when opened and back out when closed — try it twice.
Reading progress
A bar that fills as a visitor moves down a long page.
Scroll this box.
Seen something you like? Answer five short questions and we will show you your own site wearing it.
Design your site