Section 03 · Cursor

Ten things your
cursor could be doing.

On most websites the mouse pointer sits there doing nothing at all. These ten turn it into part of the design: a follower, a magnet, a spotlight, a magnifying glass. Move your cursor into any panel below and it hands over to you. Leave, and it goes back to demonstrating itself, slowly.

10Effects
<2kbTypical weight
TouchFalls back cleanly
100%Yours to keep
Hover a panel to take control, or let it demonstrate itself
01

Trailing ring

Signature
Restaurant & bar

A long table,
and no one else booked.

Book a table
Est. 2019Scroll
Move your cursor insideAuto
Move your cursor into the panel to take over

A small dot rides the pointer and a ring chases it a beat behind, swelling over anything clickable. The most requested cursor we build. It signals “this site was designed” inside one second.

Right forAnywhere first impressions carry the sale. Studios, hospitality, fashion, property, agencies.

02

Magnetic buttons

Feel
The treatment rooms

Water, shade,
and silence.

Six treatment rooms, a cold plunge, and a garden nobody photographs.

Book a consult
Open 7amBy appointment
Move your cursor insideAuto
Move your cursor into the panel to take over

The button leans toward the cursor as it approaches and springs back when it leaves. Purely tactile, and it measurably lifts clicks on the one button that matters.

Right forEvery site, on the primary call to action. Never on more than two buttons a page.

03

Spotlight

Reveal
Before and after

The same room,
eight weeks apart.

See the project
Project 04Interiors
Move your cursor insideAuto
Move your cursor into the panel to take over

The cursor carries a hole through the top layer to whatever sits underneath. Before and after, day and night, sketch and finished. Genuinely useful, not just decorative.

Right forAnyone selling a transformation. Renovation, landscaping, dentistry, fitness, cleaning, restoration.

04

Label cursor

Wayfinding
Interiors
The room
Events
View
Move your cursor insideAuto
Move your cursor into the panel to take over

The pointer picks up a label from whatever it is over. View, Play, Drag. It removes the need for buttons sitting on top of your photography, which is how galleries stay clean.

Right forGalleries, portfolios, lookbooks, menus, property tours, before-and-after sets.

05

Image trail

Showpiece
Design studio

Vessel

Start a project
Est. 2009Scroll
Move your cursor insideAuto
Move your cursor into the panel to take over

Photographs drop along the path of the cursor and fade out behind it. The loudest effect on this page, so use it on one page only, usually the home page or an About.

Right forBusinesses expected to be interesting. Studios, photographers, agencies, fashion, hospitality.

06

Card tilt

Depth
Room 04King · garden view
Move your cursor insideAuto
Move your cursor into the panel to take over

The card turns to face the cursor with a light source that travels across it. The workhorse for product and listing grids, subtle enough to run on twenty cards at once.

Right forAnywhere there are many cards. Products, listings, rooms, menus, team pages, treatment lists.

07

Hover peek

Navigation
The dining room 01
The cellar 02
Private events 03
The terrace 04
Move your cursor insideAuto
Move your cursor into the panel to take over

A text menu that shows a photograph on hover, floating beside the cursor. Lets a navigation stay entirely typographic and still be visual. It is the trick behind most agency menus you like.

Right forAny site with four to eight main pages. Replaces a cluttered dropdown outright.

08

Directional fill

Buttons
Check availability
Request a quote
Book a consultation
Move your cursor insideAuto
Move your cursor into the panel to take over

The color floods in from whichever edge your cursor crossed, and drains out the side you leave by. A detail nobody consciously names and everybody feels. It goes on every button we ship.

Right forEvery site, in every industry. This is craft, not decoration, and it costs nothing to include.

09

Loupe

Utility
Property & development

Every measurement,
drawn to scale.

Download the plans
Site plan1:500
Move your cursor insideAuto
Move your cursor into the panel to take over

A magnifying glass follows the cursor at nearly three times scale. The one effect here that is useful rather than decorative: plans, drawings, fabric, jewelry, artwork, engineering detail.

Right forAnyone selling something with fine detail. Developers, jewellers, textiles, art dealers, manufacturers.

10

Difference circle

Graphic
Law & advisory

We take on very few matters.

Nine partners. One office. Work that rarely gets talked about.

Make an enquiry
Est. 1998Los Angeles
Move your cursor insideAuto
Move your cursor into the panel to take over

One blend mode inverts everything the circle passes over, so the cursor stays legible on any background at all. It reads as art-directed rather than decorated.

Right forBrands that can carry something graphic. Agencies, galleries, fashion, portfolios, publishers.

Section 04Text stylesSection 05FontsSection 01OpeningsBack toOverview