Cursors

Brewser draws a software mouse cursor, and every cursor shape — the arrow, the hand pointer, the text beam, the resize arrows, the busy spinner — is an image you can replace. Unlike the other categories there's no picker: cursors.json defines the whole set at once, mapping each CSS cursor keyword to an image.

[
  { "name": "default", "image": "themes/cursors/default.png", "x": 31, "y": 29 },
  { "name": "pointer", "image": "themes/cursors/pointer.png", "x": 43, "y": 32 },
  { "name": "text",    "image": "themes/cursors/text.png",    "x": 48, "y": 48 },
  { "name": "wait",    "image": "themes/cursors/wait.apng",   "x": 48, "y": 48 }
]

Whenever a page (or the shell) asks for a given CSS cursor: value, Brewser looks up the matching name and draws that image, offset by its hotspot so the click lands where the user expects.

Customising cursors

Because it's one shared set, there are two ways to reskin:

Replace the images. Keep the JSON as-is and just overwrite the PNGs in themes/cursors/ with your own art (same filenames). This is the simplest way to get a whole new cursor look.

Repoint entries. Add your own image and change the image path for the shape you want:

{ "name": "pointer", "image": "themes/cursors/my-hand.png", "x": 40, "y": 4 }

Getting the hotspot right

The hotspot is the single pixel that counts as "where you clicked". For an arrow it's the tip; for a hand pointer it's the fingertip; for a crosshair or resize handle it's the centre. If clicks feel off by a few pixels, adjust x/y. The shipped cursor art is drawn on a 48×48 canvas, so hotspot values are in that range.

Animated cursors are supported: use an .apng (animated PNG) for shapes like wait/progress to get a spinner. A regular .png is a still cursor.

Related

• Toolbars — toolbar icons live alongside cursor art under themes/.
• Controls — how the software cursor is driven, and the manifest flags that hide it in docked/handheld modes.