How to Upload Per-Size Pattern SVGs

---

Prerequisites

⚠️ Important: You must have sizes already configured on your product before you can upload per-size SVGs. See the Size Run Setup guide first.

• An existing product with at least one size configured

• SVG files prepared for each size, exported from your pattern design software (e.g., Gerber, Optitex, Lectra, or Adobe Illustrator)

• Each SVG should include a viewBox attribute for correct rendering

---

Step-by-Step Instructions

1. Open the product detail page

Navigate to Products from the sidebar and click the product whose sizes you want to attach pattern SVGs to.

2. Locate the Sizes card

Find the Sizes card in the right column. You should see your configured sizes listed as rows.

Caption: The Sizes card with sizes configured and ready for pattern SVG uploads.

3. Open the size dropdown

Click the dropdown menu on the size row you want to upload a pattern for.

4. Select the upload action

Choose the Upload Pattern SVG option from the dropdown menu. This opens a file picker.

5. Select your SVG file

Choose the SVG file that corresponds to this size from your computer. The file uploads directly to cloud storage.

Naming convention recommendation: Use a consistent naming pattern like jersey-pro-size-M-pattern.svg so your team can easily match files to sizes.

6. Confirm the upload

Once the upload completes, the size row shows an indicator confirming the pattern SVG is attached. The file URL is automatically saved to the product's sizes data.

Caption: The size row for "M" showing that a pattern SVG has been uploaded.

7. Repeat for remaining sizes

Upload an SVG for each size in your size run. Each size gets its own independent file.

💡 Tip: You don't need to upload patterns for every size at once. You can add them incrementally as your production team finalizes each size's cutting template.

---

How Per-Size SVGs Are Stored

Each per-size pattern SVG is stored in cloud storage with a key scoped to the product and size:

products/{productId}/sizes/size_{CODE}_pattern.svg

For example, a Medium pattern for product abc-123 is stored at:

products/abc-123/sizes/size_M_pattern.svg

The URL is saved in the product's sizes JSONB field as the patternSvgUrl property on the matching size entry:

{ "code": "M", "patternSvgUrl": "https://..." }

---

Replacing a Pattern SVG

To replace an existing pattern:

1. Open the size's dropdown menu

2. Upload a new SVG file

3. The new file overwrites the previous one at the same storage path

4. The URL in the product data updates automatically

---

Removing a Pattern SVG

To remove a pattern SVG from a size without removing the size itself:

1. Open the size's dropdown menu

2. Select the remove/clear pattern option

3. The patternSvgUrl is removed from the size entry

⚠️ Important: Removing a pattern SVG removes the URL reference from the product data. The file may still exist in cloud storage but will no longer be associated with this size.

---

SVG File Requirements

For the best results, ensure your pattern SVGs meet these specifications:

💡 Tip: If your pattern SVGs define only a viewBox without explicit width and height attributes, Konfiwear automatically injects dimensions from the viewBox. If neither exists, a default size of 256×256px is used as a fallback.

---

Result

After uploading patterns for all sizes, the Sizes card shows upload indicators on every row. Each size now carries its own production-ready cutting template that is included when generating print-ready output.

Caption: All sizes have per-size pattern SVGs attached.

✅ Done! Your per-size pattern SVGs are configured. Production output generated from quote submissions will include the correct cutting pattern for each ordered size.

---

Tips & Best Practices

• Use consistent coordinate systems across all size SVGs so your cutting machines interpret them uniformly

• Version your SVGs by including a version number in the filename (e.g., jersey-M-pattern-v2.svg) before uploading — the storage path overwrites the previous file, so keep local backups

• Validate SVGs before uploading — open them in a browser or SVG viewer to confirm they render correctly

• Coordinate with your pattern maker — ensure the SVG export settings from your CAD software match Konfiwear's requirements (viewBox present, flat structure, clean fills)

• Upload in order — work through your size range systematically (XS → 3XL) to avoid missing a size

---

Related Articles

• Size Run Setup

• Product Setup Guide

• Understanding the Products Module