✦ Manual Updated Nov 11, 2026 by @Nicole McCain

Pip's Studio — Settings Reference

Settings reference and documentation handbook.

Overview

Most brush tuning now happens in the Brush Workshop inside the app; brushes.js only holds the built-in defaults.

Where	What it controls	How to change it
Brush Workshop	Every brush setting, custom tip shapes, new and duplicated brushes	Sliders button in the top bar, or W
Bottom dock	Brush, size, opacity and color while drawing	Tap or drag
Pen readout panel	Pressure feel (pressure curve)	Pencil icon, top right
`studio/js/brushes.js`	Default values for the six built-in brushes	Edit the numbers, save, reload. Brushes you've edited in the Workshop keep your edits until you press Reset
Browser storage	Your brushes and edits, palettes and recent colors, current brush or tool, color, pressure feel, theme, per-brush size and opacity, all your drawings	Saved automatically

Every drawing autosaves to the browser about 2 seconds after each stroke. Each drawing has its own canvas size, set when you create it.

Gallery and drawings

Each drawing is saved on its own and autosaves about 2 seconds after each stroke. Open the gallery with the grid button next to the logo, or G; the app reopens the last drawing you used.

Action	Where	Notes
New drawing	Gallery → New drawing	Pick a size and paper. Created and opened straight away
Open	Tap a thumbnail	Saves the current drawing first
Rename	Card button	Up to 60 characters
Duplicate	Card button	Copies the artwork as a new drawing
Export	Card button	Saves a `.pipstudio` file
Import	Top of the gallery	Adds a drawing from a `.pipstudio` file. Never overwrites
Delete	Card button	No undo. Deleting the open drawing opens your most recent other one

Canvas size	Pixels
Landscape	2048 × 1536
Portrait	1536 × 2048
Square	2048 × 2048
Screen size	Your display's pixels, landscape
A4 print (300 dpi)	2480 × 3508
Custom	64–4096 per side, about 16 million pixels at most

Paper: White, Cream or Transparent. Transparent shows a checkerboard and exports a see-through PNG.

Export (top bar) saves the open drawing as a PNG named after it, on its paper color.

A .pipstudio file holds the name, size, paper and artwork as lossless PNG layers. Every layer is included with its name, opacity, blend mode, visibility and lock. Undo history isn't included.

Imports are checked like brush files: wrong formats and unsupported sizes are refused, and layer images are redrawn as plain pixels.

App, offline and phones

Pip's Studio lives at [pipandpixel.net/studio](https://pipandpixel.net/studio/) and can be installed like an app.

Topic	How it works
Install on iPad / iPhone	In Safari: Share → Add to Home Screen. Opens full screen with the paw icon
Offline	After one visit online, the studio opens without internet, in the browser or from the home screen. Online, it always loads the newest version
Home-screen storage on iPad	The home-screen app keeps its own storage, separate from Safari. Move drawings and brushes over with Export and Import
First visit	A welcome pop-up gives quick tips. “Don't show this again” is ticked by default; Help → Tips can show it again
Phones (under 700 px wide)	The top bar keeps Undo, Redo and Layers; everything else is in the ⋯ menu
Small phones (under 430 px)	Dock tools show as icons only, so all of them fit
New drawings	On a tall screen, new drawings start as Portrait (1536 × 2048)
Moving the canvas	Panning stops once the canvas covers about 40% of the screen, so it can't get lost off the edge. Zoomed in, every corner is still reachable

Fill and colors

Fill (paint bucket)

The bucket is the first tool in the dock (F). Tap an area to fill it with the current color on the selected layer.

Setting	Where	What it does
Tolerance	The Size slider, while Fill is selected	0–100% (default 15%). Higher fills across more similar colors
Opacity	The Opacity slider, while Fill is selected	Opacity of the fill

Fill looks at all visible layers to find edges, so line art can sit on its own layer with the color filled on a layer below.

The filled area grows 1 px, so it tucks under soft line edges without a light halo.

Fill respects hidden, locked and alpha-locked layers, and is undoable.

Fill leaking out? Close gaps in the line art or lower Tolerance.

Colors and palettes

The rainbow square in the dock opens the color panel.

Part	What it does
Hue ring	Drag around it to pick the hue. Starting from black or gray, it jumps to a vivid shade
Shade square	Across: from white to full color. Down: towards black
Hex	Type a color such as #f2792b
Add to palette	Adds the current color to the selected palette
Recent	The last 12 colors you actually painted with
Palette	Pick a palette; the dock's swatches show its first 12 colors
New / Rename / Delete	Manage palettes (up to 48 colors each)
Remove…	Tap colors to take them out of the palette; Done to finish
Import	Paste any text with hex codes, such as the Palette Extractor's “Copy CSS Variables”
Copy	Copies the palette as CSS variables (--color-1, --color-2 …)

The starting palette is Pip & Pixel. Palettes and recent colors are saved on the device.

Layers

Every drawing is a stack of layers, drawn bottom to top over the paper. Open the Layers panel with the stacked-layers button in the top bar, or L; tap a layer to draw on it.

Control	What it does	Undoable
+	Adds a layer above the selected one	Yes
Eye	Shows or hides a layer	No
Lock	Protects a layer from drawing and clearing	No
Alpha lock	Painting and fill only land where the layer already has paint; the row shows “α lock”. The Eraser still erases	No
Opacity	0–100% for the whole layer	Yes
Normal / Multiply / Screen / Overlay	How the layer mixes with the layers below	Yes
Up / Down	Moves the selected layer	Yes
Duplicate	Copies the selected layer above it	Yes
Merge down	Combines the layer into the one below, keeping its look	Yes
Rename	Up to 40 characters	No
Clear	Empties the selected layer (also the trash button in the top bar)	Yes
Delete	Removes the selected layer; a drawing keeps at least one	Yes

Canvas size	Layers allowed
2048 × 1536 (Landscape, Portrait)	15
2048 × 2048 (Square)	11
2480 × 3508 (A4 print)	5

The limit keeps big drawings inside iPad Safari's memory; the panel shows the count, such as 2 of 15.

Drawing on a hidden or locked layer is refused with a message.

The eyedropper picks the color you see across all visible layers.

Undo stores only the changed area of each step. Very old steps are dropped once history passes about 160 MB.

Brush Workshop

Open it with the sliders button in the top bar or W; close with ×, Esc, or a tap outside the panel. Picking a brush there also makes it your current brush.

Part	What it does
Brush list	All brushes. A dot marks a built-in you've edited; custom brushes are labeled
Duplicate	Copies the selected brush, including your current size and opacity
Reset	Puts an edited built-in back to its `brushes.js` defaults, including its tip
Delete	Removes a custom brush. Built-ins can't be deleted. No undo
Import	Adds brushes from a `.pipbrush` or `.pipbrushes` file
Export	Saves the selected brush as a `.pipbrush` file
Export all	Saves all custom and edited brushes as one `.pipbrushes` pack
Test pad	Sample strokes for the brush type. Draw on it with any pen or finger. Brushes show at the size they appear on your drawing
Sample / Clear	Bring back the sample strokes, or start blank
Settings	Name, then Shape, Stamp, Paint, Tilt shading and Feel. Only settings that apply to the brush are shown

Every change redraws the pad straight away, including strokes you drew yourself.

Custom tip shapes

Import image… turns a picture into the brush's stamp. The shape is stored inside the brush.

Input	How the shape is read
SVG	Drawn at 512 px, then read like a transparent image
PNG or WebP with transparency	Opaque areas become paint; colors are ignored
Opaque image, e.g. black on white	Dark areas become paint, white becomes empty

Invert swaps paint and empty; Round goes back to a round tip.

Importing sets Spacing to at least 30% so the shape shows instead of smearing into a ribbon.

Import onto a duplicate to keep the original. Reset also removes an import from a built-in.

Stamp brushes

Any round brush can place one stamp per tap instead of drawing a stroke. Turn on Stamp mode in the Workshop's Stamp group; the built-in Stamp brush (Pixel's paw print) has it on already.

Action	Result
Tap	One stamp. Pressing harder makes it bigger; the firmest pressure during the tap counts. Mouse and finger taps stamp at full size
Press and drag (with Drag to size and rotate on)	The stamp's radius follows the drag distance and it turns to face the drag. Dragging straight up keeps it upright

In stamp mode, Spacing, Scatter, Smoothing and Tilt shading are hidden because they only apply along a stroke.

Size variation and Angle jitter make repeated stamps look less identical.

The test pad shows stamp samples for stamp brushes: four taps at rising pressure and two dragged stamps.

Brush files and packs

Brushes can be saved as files to back them up, move them between devices, or share them.

File	Holds	Made by
`.pipbrush`	One brush	Export, with the brush selected
`.pipbrushes`	A brush pack: all your custom and edited brushes	Export all

Files include every setting, the tip image, and the size and opacity you have set in the dock.

Import adds the brushes as new custom brushes. Nothing you already have is overwritten.

Import checks every field: unknown fields are dropped, numbers are kept in range, and only image data is accepted as a tip.

On the iPad over plain http, exports download to the Files app; on HTTPS they open the share sheet.

The Import picker accepts any file, because iPad greys out unfamiliar extensions like .pipbrush.

Brush settings

Each Workshop setting is one field of the brush, the same field names used in brushes.js. Sizes are in canvas pixels; most other values run from 0 to 1.

Workshop setting	Field	Range	What it does
—	`kind`	`round` or `pixel`	Round stamped tip, or chunky squares snapped to a grid
Tip shape	`tip`	Round or an imported image	The stamp's shape
Size	`size`	px, within `sizeRange`	Diameter at full pressure (Pixel: grid cell size)
Size at light pressure	`minSize`	0–100%	Diameter at zero pressure. 100% = pressure doesn't change size
Edge hardness	`hardness`	0–100%	0 = airbrush-soft, 100% = crisp. Round tips only
Spacing	`spacing`	2–150% of diameter	Gap between stamps. Lower = smoother, slower
Scatter	`jitter`	0–200% of diameter	Random sideways scatter of stamps
Size variation	`sizeJitter`	0–100%	Random size per stamp. 100% = down to 20% size
Tip angle	`tipAngle`	0–360°	Rotation of an imported tip
Rotate with stroke	`followStroke`	on / off	Imported tip turns with the stroke direction
Angle jitter	`angleJitter`	0–100%	Random rotation per stamp. 100% = any angle
Stamp mode: one per tap	`stampMode`	on / off	One stamp per tap instead of a stroke
Drag to size and rotate	`stampDrag`	on / off	In stamp mode, press and drag to size and turn the stamp
Opacity	`opacity`	5–100%	Opacity of the whole stroke. Overlaps inside one stroke don't darken
Flow	`flow`	1–100%	Alpha of each stamp. Builds up where stamps overlap
Pressure darkens	`pressureFlow`	on / off	Pressure also controls flow
Speckle	`grain`	0–100%	Random alpha variation per stamp
Paper grain	`paperGrain`	0–100%	Paper texture; light strokes show it, heavy strokes fill it in
Erases instead of painting	`erase`	on / off	Removes paint
Smoothing	`smoothing`	0–90%	Stabilizer. Higher = smoother lines, more lag

Tilt shading and paper grain

The Pencil uses these by default. Any round brush can: set Shading width above 0 in the Workshop. Angles are measured from the screen: 90° = upright, 0° = flat.

Workshop setting	Field	Pencil value	What it does
Shading width (0 = off)	`tiltSize`	5×	Extra width at full tilt (5 = 6× the diameter). 0 turns tilt shading off
Starts below	`tiltStart`	52°	Angle where shading begins. Normal writing is about 55–70°
Full strength at	`tiltFull`	22°	Angle where shading is at full strength
Stretch along the lean	`tiltStretch`	1.5×	Extra length along the lean direction (1.5 = 2.5× as long)
Lighter when tilted	`tiltFade`	30%	How much lighter stamps get at full tilt
Softer when tilted	`tiltSoftness`	70%	How much the tip edge softens at full tilt. Round tips only
Paper grain	`paperGrain`	55%	Paper texture; light strokes show it, heavy strokes fill it in

The pen readout's Tilt shading row shows the current shading amount for the selected brush, so you can see where your natural angles fall.

The brushes

Built-in defaults in brushes.js. Workshop edits override them until you press Reset. Number keys 1–9 pick brushes in dock order.

Brush	Size (range) px	minSize	Opacity	Flow	Pressure → flow	Hardness	Spacing	Jitter	Grain	Smoothing
1 Pencil	5 (1–40)	0.4	1	0.45	yes	0.85	0.14	0.15	0.4	0.2
2 Ink	10 (1–120)	0.12	1	1	no	0.96	0.06	0	0	0.45
3 Marker	28 (4–200)	0.75	0.55	1	no	0.75	0.06	0	0	0.3
4 Airbrush	140 (10–600)	0.6	1	0.1	yes	0	0.08	0	0	0.2
5 Pixel	16 (2–64)	1	1	1	no	1	—	0	0	0
6 Eraser	40 (2–300)	0.4	1	1	no	0.8	0.06	0	0	0.2
7 Stamp	120 (10–800)	0.45	1	1	no	—	—	0	0	—

The Pencil also has the tilt and paper grain values above. The Stamp uses the paw-print tip with stamp mode and drag on, and 6% angle jitter. Opacity and size here are defaults; whatever you set in the dock is remembered per brush.

In-app controls

These change while you draw and are remembered between visits.

Control	Where	Notes
Gallery	Grid button next to the logo	All your drawings. See Gallery and drawings above
Layers	Stacked-layers button, top bar	See Layers above
Fill	First tool in the dock	See Fill and colors above
Brush	Bottom dock	Custom brushes appear after the built-ins, shown with their tip shape. Picking a color while an eraser is on switches back to your last drawing brush
Size	Bottom dock slider	Scales smoothly across the brush's size range. Remembered per brush. Becomes Tolerance while Fill is selected
Opacity	Bottom dock slider	5–100%, whole-stroke opacity. Remembered per brush
Color	Swatches + rainbow square	Swatches show the selected palette; the rainbow square opens the color panel
Brush Workshop	Sliders button, top bar	All brush settings and custom tips. See Brush Workshop below
View menu	Sun/moon button, top bar	Theme, desk and grid
Help	? button, top bar	How-to, shortcuts, tips, and a link back to this reference
Pressure feel	Pen readout panel	0.40–2.50. Lower = light touch gives more; higher = needs a heavier hand. 1.00 = as the pen reports it
Undo / redo	Top right	While the drawing is open; covers strokes, fills and layer changes
Fit	Top right	Resets zoom, pan and rotation
Export	Top right	PNG of all visible layers on the paper. Touch devices open the share sheet; desktop downloads
Clear	Trash button, top right	Empties the selected layer. Undoable

On phones, Brush Workshop, Fit, View, Pen readout, Help, Export and Clear are in the ⋯ menu.

Stored in the browser: custom brushes and Workshop edits, current brush, color, pressure feel, theme, per-brush size and opacity, and every drawing in your gallery. Undo history isn't saved across reloads.

Themes

The studio has two themes; Pip orange is the accent in both. Pick it in the View menu (sun/moon button in the top bar), or switch with T.

Theme	Look	Good for
Workbench (dark)	Warm neutral charcoal, amber headings	Judging color: the neutral surround keeps canvas colors true
Sketchbook (light)	Paper panels, ink-brown text, terracotta headings	Daylight drawing, a paper feel

Until you pick one, the studio follows your device's light or dark setting, including when it changes.

Once you pick, your choice is remembered on that device.

Themes change only the app around the canvas. Paper color is set per drawing, and the palette swatches are paint colors, so neither changes with the theme.

Desk and grid

The View menu also holds the desk behind the canvas and a graph paper grid.

Setting	Options	Notes
Table	Wood, Plain	Wood is a walnut desk in Workbench and oak in Sketchbook. Plain is best for judging color
Grid	Off, Square, Isometric, Pixel iso	Square is graph paper; Isometric is ±30° triangles with verticals; Pixel iso is 2:1 diamonds
Square size	4–512 px	Triangle size or diamond height for the isometric grids
Strong line every	Off, 2–10 lines	Like the darker lines on real graph paper
Visibility	10–100%
Color	Blue, Gray, Green

The grid is a guide only: it's never part of the artwork, PNG exports or .pipstudio files.

Grid settings are saved with each drawing; new drawings start with no grid. # turns it on and off.

Zoomed far out, thin lines closer than about 4 screen pixels are skipped so the grid doesn't turn into a smear.

Input and gestures

The pen always draws. Fingers draw only until a pen is used; after that they switch to gestures until the page reloads.

Input	Action	Result
Pen	Draw	Uses real pressure and tilt
Pen	Hover (Pencil Pro, Windows pens)	Shows brush size; the Pencil shows its tilted shading tip
Pen	Flip to eraser end (Windows pens)	Erases
Pen	Barrel button	Picks a color from the canvas
Finger, before a pen is used	Draw	Pressure is faked from speed: faster = thinner
Finger, after a pen is used	1 finger drag	Pan
Fingers	2 finger drag / pinch / twist	Pan, zoom, rotate. Rotation snaps back to straight within about 5°
Fingers	2 finger tap	Undo
Fingers	3 finger tap	Redo
Mouse	Left drag	Draw at full pressure
Mouse	Right click or Alt + click	Pick a color
Mouse	Middle drag, or Space + drag	Pan
Mouse / trackpad	Scroll	Pan
Mouse / trackpad	Ctrl + scroll, or pinch	Zoom

Touches are ignored while the pen is drawing, so a resting palm won't move the canvas mid-stroke.

Keyboard shortcuts

On a Mac or iPad keyboard, Cmd works wherever Ctrl is listed.

Keys	Action
Ctrl + Z	Undo
Ctrl + Shift + Z, or Ctrl + Y	Redo
Ctrl + S	Export PNG
1–9	Brushes in dock order (built-ins: Pencil, Ink, Marker, Airbrush, Pixel, Eraser, Stamp)
E	Eraser
F	Fill
L	Show / hide the Layers panel
G	Open the gallery
W	Open the Brush Workshop
T	Switch between Workbench and Sketchbook
#	Grid on / off
?	Help
Esc	Close the open panel or menu
\[ and \]	Smaller / bigger brush
+ and −	Zoom in / out
0	Fit canvas to screen
Space (hold)	Pan with the mouse
I	Show / hide the pen readout

Canvas shortcuts are paused while the gallery or Workshop is open.

Tuning recipes

Open the Brush Workshop, pick the brush, and drag the setting below; the test pad shows the result straight away.

I want…	Brush	Workshop setting	Direction
Darker pencil	Pencil	Flow	Up (45% → 60%)
Smoother, less speckly pencil	Pencil	Speckle or Paper grain	Down
Shading to start later	Pencil	Starts below	Down (52° → 45°)
Broader shading	Pencil	Shading width, Stretch along the lean	Up
Stronger airbrush	Airbrush	Flow	Up (10% → 15%)
More dramatic ink taper	Ink	Size at light pressure	Down
Less lag behind the pen	Any	Smoothing	Down
Steadier, smoother lines	Any	Smoothing	Up (stay under 70%)
Solid marker	Marker	Opacity	Up to 100%
Bigger light taps	Stamp	Size at light pressure	Up
Stamps all the same size from taps	Stamp	Size at light pressure	100%
Less uniform rows of stamps	Stamp	Size variation, Angle jitter	Up
My own stamp	Duplicate Stamp	Tip shape → Import image…	—
Stamp or texture brush	Duplicate any round brush	Tip shape → Import image…, then Scatter and Angle jitter	Up
My brushes on another device	Any	Export all, move the file, then Import there	—
Pressure too sensitive overall	—	Pressure feel, in the pen readout	Right (heavier hand)

To make a new brush, select the closest one and press Duplicate, then rename and adjust it. To change a built-in's defaults for everyone, edit brushes.js.