The live Sashiko Grid tool with Asanoha selected. Captured on 21 October 2026.
A browser tool for making measured sashiko grids and pattern guides, with an interactive preview, actual-size PDF and SVG exports, and tiled printing for larger designs.
My role
Independent designer and developer
Platform
Web-based utility
Built with
React, TypeScript, Tailwind CSS, SVG / PDF
The problem
Preparing a differently sized patch means measuring and drawing the same repeated marks again. A screen preview also needs to keep its dimensions when printed.
My approach
Connect a measured pattern preview to vector downloads, with shared geometry, paper settings and a scale check for printing.
The result
A live tool for creating printable guides in the browser, without an account or a subscription.
Decisions
Sashiko Grid is my independent web utility for the preparation that comes before stitching: choosing a guide, sizing it for the fabric and getting it onto paper.
The website brings the generator, pattern notes and printing guidance together. It keeps the everyday tool free and available without creating an account.
Share the geometry
The preview and exports use the same repeat geometry. Dimensions and spacing stay connected as the pattern moves from the screen to a vector file.
Design for paper
PDFs support A4 and US Letter, a scale check and numbered overlapping tiles for larger guides. SVGs preserve the full guide at its millimetre dimensions.
Keep the picker manageable
The picker reveals patterns in groups and retains the selected option, so the library can grow without placing every control on screen at once.
Generate in the browser
The tool calculates the guide and creates the downloadable files locally, without requiring an account or sending measurements to an AI service.
The work
An interactive pattern workspace
A React and TypeScript interface connects the pattern library to dimensions, spacing and a live SVG preview. Makers can switch between millimetres and inches.
Vector exports and tiled printing
Reusable pattern tiles drive SVG and PDF output. Large PDFs include numbered sheets, overlaps and alignment marks to help join the printed guide.
Guidance beside the tool
Pattern notes and a printing guide explain scale, repeat fitting and the limits of a transfer guide, giving the surrounding website a practical role.
Outcomes
Live browser tool
The public generator offers an interactive pattern preview and controls without an account requirement.
Printable and editable guides
Actual-size PDF output and full-size SVG files support printing and further work in compatible drawing software.
Constraints, lessons and next steps
Constraints
Printer scaling can change the final dimensions. The printing instructions explain actual-size settings and the PDF scale check.
The output is a drawing and transfer guide. It does not supply a complete sewing pattern or stitch-order lesson.
Named traditional motifs need context; the library also contains general geometric guides.
Reflections and next steps
The shared geometry and separate export functions give the tool a clear place to improve patterns and printing behaviour as it develops.
For this utility, the important technical work sits between the preview and the printed page: units, repeat geometry, tiling and clear instructions.
