Generative Textile Pattern Tool
Enter a collection concept and generate a living textile pattern. Palette and structure are AI-suggested, then fully adjustable. Exports as SVG.
Starting a textile pattern from a blank canvas can be slow, especially when palette, scale, repeat structure, and product context all need to be considered at once. This tool turns a short collection concept into a live pattern direction: the AI suggests a palette and pattern style, then the designer keeps control through editable colors, density, pattern type, mockup previews, and SVG export.
Fashion and textile designers exploring collection concepts, students testing surface design directions, and anyone who wants a fast bridge between mood language and repeat-pattern visuals.
I wanted a generative tool that felt like a studio assistant rather than an automatic design replacement. The AI handles the first suggestion, but the final pattern still comes from human choices: color edits, pattern selection, density, and how the repeat sits on an object.
The tool currently supports five hand-coded pattern systems: geometric, floral, organic Truchet, stripe, and grid. The AI only suggests palette and style metadata; it does not generate image pixels. The live pattern is rendered in the browser with Canvas and exported as SVG.
Architecture
The browser owns the live pattern canvas and mockup previews. A Netlify function asks Claude for a palette and suggested pattern style, then the client applies those values to hand-coded Canvas algorithms and SVG export.
AI suggests palette/style · Designer edits colors, density, and pattern
Text concept only; no photo upload in this tool
| Palette | Returns five editable colors from the collection concept so the user has a starting palette without locking the design. |
| Pattern style | Maps the concept to one of the available pattern algorithms while keeping manual pattern buttons available. |
| Mood note | Adds a short interpretive note explaining the palette direction. |
| Canvas preview | Renders the selected pattern live so color and density changes are immediately visible. |
| Mockup previews | Projects the current pattern into product-context SVGs for scale and placement checks. |
- AI suggests, designer decides The model outputs a palette and pattern recommendation, but every value remains editable. The tool reduces blank-canvas friction without automating the final design.
- Canvas for motion, SVG for export The live view uses Canvas because the pattern needs continuous animation and redraws. Export creates a static SVG snapshot for use outside the browser.
- Hand-coded pattern systems Five named algorithms produce more intentional results than a generic image generator, and they make density and palette controls predictable.
- Mockups as design context The chair, coat, and tote previews reuse the live canvas as a pattern fill so the user can judge scale and surface behavior immediately.
Click to pause · Click again to resume