inkwash
a watercolor sketching app and explanation
Last verified:
What is inkwash?
Inkwash is a watercolor simulator and drawing app that recreates the experience of nature journaling with a Pilot G2 pen and waterbrush in a browser. Built as a single HTML file under 1,000 lines with no dependencies, it uses fluid dynamics simulation and shader tricks to mimic watercolor-style ink washes with realistic effects like chromatic separation, edge darkening, granulation, and wet sheen.
The app maintains three floating-point texture fields under the canvas: ink (mobile pigment stored as optical density), fixed (pigment settled into paper), and wet (water amount). It runs Jos Stam's Stable Fluids algorithm for water movement with pressure projection and vorticity confinement, while pigment mobility and velocity are confined to wet paper areas. The display shader uses Beer-Lambert law for realistic glazing where overlapping strokes add density rather than clipping to mud.
Key features include pen and brush modes, white ink (gouache) in the alpha channel, a fix button (or 'd' key) to settle pigment into the paper, adjustable color/chroma separation, drying time control via the dry slider, flow and vorticity controls, and device-specific input mapping. iPad users can draw with Apple Pencil while using their finger as the water brush simultaneously; tablet users can swap pen for brush via the barrel button; Mac trackpad users get Force Touch pressure support.
Inkwash is designed for nature journalers, sketchers, and anyone who wants authentic watercolor dynamics without physical materials. It supports wet-on-wet painting, line-then-wet workflows, dry brush techniques, and brush ink loading. The app requires WebGL2 with renderable half-float textures (EXT_color_buffer_float), available on devices from roughly 2021 onward, and runs at 60fps on phones despite twelve shader passes including 22 Jacobi iterations.
inkwash pricing
Pricing model: Freemium
Free - Inkwash is completely free to use as a single HTML file with no dependencies. The app has no paid tiers, subscriptions, or licensing costs. Users can open it directly in the browser at johnowhitaker.github.io/inkwash, view the full source code on GitHub at github.com/johnowhitaker/inkwash, and use all features including pen mode, brush mode, white ink, fix function, and all sliders (color, dry, flow, brush ink) without any payment or account required.
inkwash pros
- Single HTML file under 1,000 lines with no dependencies
- No build step required - just open in browser
- Realistic watercolor chromatic separation at edges
- Edge darkening effect mimics real watercolor signature
- Granulation speckle from pigment particles settling
- Wet sheen shows where paper is wet for working window
- Beer-Lambert law for realistic glazing without mud
- Jos Stam's Stable Fluids algorithm for stable fluid sim
- Two pigment fields: mobile ink and fixed settled pigment
- White gouache in alpha channel composites over dark ink
- Fix button settles pigment and flash-dries wetness
- Adjustable color/chroma separation slider from 0 to high
- Dry slider controls drying time from 2 to 18 seconds
- Flow and vorticity controls tied to push strength
- iPad Apple Pencil draws while finger is water brush simultaneously
- Tablet stylus barrel button swaps pen for brush instantly
- Mac trackpad Force Touch drives line weight with pressure
- Cursor chased not obeyed absorbs jitter and rounds corners
- Stillness makes mark - dwelling pen blooms like real nib
- Gaussian splat primitive creates smooth ribbon strokes
- Water uses MAX blending so scrubbing makes paper wet not flooded
- Ink is additive - densities sum like real glazes deepening
- Coarse 256-cell velocity grid makes expensive solve cheap
- High 2048 resolution ink field preserves edges and granulation
inkwash cons
- Requires WebGL2 with EXT_color_buffer_float support
- Only works on devices from roughly 2021 or newer
- AI-written prose on about page may bother some users
- Author hasn't touched code - AI generated the app
- No color storage - color only exists in display shader
- Mouse/finger fake pressure from speed which is wrong theoretically
- Bilinear sampling acts as low-pass filter blurring whirlpools
- White gouache baking is destructive like real opaque gouache
- No undo - same as physical pen but limits digital correction
- Single HTML file means no modular code organization
Frequently asked questions about inkwash
What is Inkwash and what does it do?
Inkwash is a watercolor simulator and drawing app that recreates the physical experience of nature journaling with a Pilot G2 pen and waterbrush in a browser. It uses fluid dynamics simulation (Jos Stam's Stable Fluids algorithm) and WebGL2 shader tricks to mimic authentic watercolor effects including chromatic separation at edges, edge darkening, granulation speckle, and wet sheen. The app is a single HTML file under 1,000 lines with no dependencies.
How do I access and use Inkwash?
Open johnowhitaker.github.io/inkwash in any browser that supports WebGL2 with renderable half-float textures (EXT_color_buffer_float), which includes devices from roughly 2021 onward. No installation, account, or payment is required. Use pen mode (b key) for linework and brush mode for water washes. Press d or click fix to settle pigment, w for white ink, c to clear, s to save PNG, and f for fullscreen.
What devices and input methods work with Inkwash?
iPad users get the best experience: Apple Pencil draws while your finger simultaneously acts as the water brush with no mode switch needed. Tablet users can swap pen for brush via the stylus barrel button. Mac trackpad users get Force Touch pressure for line weight. Mouse or finger users have pressure faked from speed (slow equals heavy), which is theoretically wrong but convincing in practice. The app requires WebGL2 with EXT_color_buffer_float from 2021+ devices.
What are the pen and brush modes and how do they differ?
Pen mode stamps ink splats where radius and density grow with stylus pressure and shrink with speed - fast flicks give thin dry lines, slow heavy drags give dark swelling ones. Brush mode stamps water splats plus velocity impulses along motion direction. Scrubbing the brush wetts paper rather than flooding it due to MAX blending. The brush position relaxes toward the pointer exponentially, absorbing jitter and rounding corners like a real brush's follow-through.
What is the fix button and when should I use it?
Fix (or d key) runs a 1.2-second settling pass that transfers mobile pigment to the fixed layer, brakes velocity hard, and flash-dries wetness. The painting looks identical before and after but changes state from liquid to laminate - you can glaze over fixed pigment without reviving it, like layering real watercolor. Use it after drawing linework so your shading can't destroy your drawing, then brush freely for wet-on-wet effects on top.
How does the color/chroma separation slider work?
The color slider controls C in the chroma vector where red-absorbing dye (looking cyan-blue) escapes fastest at 1.0+0.85*C, green at 1.0+0.15*C, and blue-absorbing dye drags behind at max(0.25, 1.0-0.65*C). At 0 the channels move in lockstep like lamp black. Pushed up, dyes split apart creating a dark core with cool halo at wet edges - no halo is drawn, it separates naturally through chromatography like real black ink on wet paper.
What do the dry, flow, and brush ink sliders control?
Dry sets the water evaporation time constant from about 2 to 18 seconds - higher values give you more movement time before committing, closer to sumi-e than watercolor. Flow controls vorticity confinement along with push strength and velocity decay rate, adding liveliness so pushes turn into eddies and curls instead of sprays. Brush ink turns the water brush into a loaded watercolor brush for broad pigment without drawing thousands of pen lines.
What painting workflows does Inkwash support?
Line-then-wet is the native idiom: draw, press d to fix, then brush freely so shading can't destroy drawing but fresh ink still moves. Wet-on-wet inverts this: lay clean water first, then drop pen into it so ink hitting a puddle blooms outward instead of holding line. Dry brush against the clock uses high dry slider for two seconds of movement then commitment. Brush ink slider enables broad pigment without thousands of pen lines.
How does white ink work in Inkwash?
White gouache rides in the pigment texture's alpha channel and composites over dark ink on screen. But physically you're drawing on a fresh white ground when you draw dark on top of fixed white, so the new line must read dark. At fix time, white coverage bleaches the density underneath it - the dark ink it hides is genuinely removed in transmittance space - then the white itself dissolves into the paper. This is destructive like real opaque gouache.
Why is Inkwash built as a single HTML file and what are the technical requirements?
The app is a single HTML file under 1,000 lines with no dependencies and no build step, created by the author speaking to AI (Claude Fable 5) about their idea and refining over time. It needs WebGL2 with renderable half-float textures (EXT_color_buffer_float), available on devices from roughly 2021 onward. The full pipeline runs twelve shader passes including 22 Jacobi iterations at 60fps on phones because the expensive solve happens on the coarse 256-cell grid while ink/wet live at 2048 resolution.