50:I[267044,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/15s1ft4k9lx-7.js","/creators-assets/_next/static/immutable/chunks/0x8sumr53pdkk.js","/creators-assets/_next/static/immutable/chunks/3pud1dqsw0-_7.js","/creators-assets/_next/static/immutable/chunks/1m75iqpnspynu.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/3ohf-5_4hfjuq.js","/creators-assets/_next/static/immutable/chunks/2jjhfe7-w6y9a.js","/creators-assets/_next/static/immutable/chunks/325i2v5l4tnlq.js","/creators-assets/_next/static/immutable/chunks/0kisxyo3aw231.js","/creators-assets/_next/static/immutable/chunks/2b1mm8iiske-y.js","/creators-assets/_next/static/immutable/chunks/0i7m0zg6jfazw.js","/creators-assets/_next/static/immutable/chunks/3-hmotkz_bdv_.js","/creators-assets/_next/static/immutable/chunks/06bqtx1jsc1kz.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3naniu4pnqfyw.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/456d4lcv9-syj.js","/creators-assets/_next/static/immutable/chunks/36-o7-3julke0.js","/creators-assets/_next/static/immutable/chunks/2xq6uu2rcdc2i.js","/creators-assets/_next/static/immutable/chunks/2y9gv91n8o3i9.js","/creators-assets/_next/static/immutable/chunks/3z6ke99nzr4_e.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/1fkcqskfw4hol.js","/creators-assets/_next/static/immutable/chunks/3ixl4aqv6ylo7.js","/creators-assets/_next/static/immutable/chunks/2x7-2b3jcc9x7.js","/creators-assets/_next/static/immutable/chunks/2di2v55rtz-8i.js","/creators-assets/_next/static/immutable/chunks/3_pg4jxj9aiiw.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/3b306xa-3tb7g.js","/creators-assets/_next/static/immutable/chunks/3g6klxxyg4m8-.js","/creators-assets/_next/static/immutable/chunks/2fvzgkzqkig_w.js","/creators-assets/_next/static/immutable/chunks/00owjoob9gqs9.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js"],"S"] 51:T798,

`Custom T-shirt & Apparel Designer`

Let visitors design custom clothing with text, images and colors

Apparel Designer is an interactive design tool for Framer. Visitors upload front and back images of any garment, then customize it right on your site: change the color, add text, place their own images or logos, and export the finished design.

Built for boutiques, print-on-demand shops, merch stores and custom apparel brands that want visitors to design their own products.

FEATURES

- Works with any garment: dresses, tops, hoodies, tees and more

- Front and back views for full-garment designs

- Custom color picker to recolor the garment

- Text tool with 16 fonts, bold, italic and adjustable font size

- Image and logo upload (up to 8 MB)

- Layers panel to select, arrange and manage design elements

- Undo and redo

- One-click design export

- Works best with transparent PNG product images

TYPICAL USE CASES

- Custom dress and boutique design pages

- Print-on-demand and merch stores

- Team, club and event apparel ordering

- Mockup and preview tools for clothing brands

- Product customizers for online shops

HOW TO USE

1. Copy the component into your Framer project.

2. Drag Apparel Designer onto your canvas and resize it.

3. In the properties panel, add your own front and back garment images [Transparent Background + White image].

4. Publish your site and try the designer in the live preview.

TIPS

- Use PNG images with a transparent background so color changes look clean.

- Keep front and back images the same size for the best alignment.

- Test uploads and export in the live preview, not only on the canvas.

Need help? Contact me at [tamimahmedruet@gmail.com].

4f:["$","$L50",null,{"value":{"fallback":{"$inf$activity-creator-4a178cd3-7094-477d-9edb-4d9cdd60feeb-all:/unified/creator/4a178cd3-7094-477d-9edb-4d9cdd60feeb/activity/":[{"data":[{"id":"01a112df-502c-7193-95b3-72f06e912e3a","type":"creator.followed","target":{"type":"creator","id":"bcb94bf9-7aa9-40d7-b681-19421ce62bd3","preview":"Ahmet Loca","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/107742/avatar-FjO7QBJgG4WwbY6uS5eymN55rN0btF.jpg","slug":"ahmet-loca","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"4a178cd3-7094-477d-9edb-4d9cdd60feeb","name":"Tamim Ahmed","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/59fjxw35","slug":"tamim-ahmed-ruet","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-06T20:19:47.334Z","latestAt":"2026-10-06T20:19:47.334Z"},{"id":"01a107e9-dc50-706f-8138-f1648634fedc","type":"creator.followed","target":{"type":"creator","id":"1ac65918-40f0-4841-a350-02ec81721c92","preview":"The Ghavas","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/79832/avatar-O8rQOrrLuaO8QhdYl0r5yBrmDhKC79.jpg","slug":"theghavas","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"4a178cd3-7094-477d-9edb-4d9cdd60feeb","name":"Tamim Ahmed","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/59fjxw35","slug":"tamim-ahmed-ruet","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-04T17:15:29.222Z","latestAt":"2026-10-04T17:15:29.222Z"},{"id":"01a107bb-9860-7098-b772-1c45a46a4a8c","type":"comment.liked","target":{"type":"comment","id":"01a0d045-6a22-71de-813a-65c0793cb56d","preview":"Nice","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Nice"}]}]},"thumbnail":null,"targetDeleted":false,"owned":false,"actions":{"postId":"01a0c0d4-e0dd-7139-8a79-168ffe8f5ead","like":{"count":1,"liked":false},"reply":{"parentCommentId":"01a0d045-6a22-71de-813a-65c0793cb56d"},"repost":null}},"context":{"type":"post","id":"01a0c0d4-e0dd-7139-8a79-168ffe8f5ead","preview":"Apparel Designer","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/01a0c0d1-9ae5-75b9-af8b-29104fe7618a.png","targetDeleted":false,"owned":true,"actions":{"postId":"01a0c0d4-e0dd-7139-8a79-168ffe8f5ead","like":{"count":7,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"actors":[{"id":"4a178cd3-7094-477d-9edb-4d9cdd60feeb","name":"Tamim Ahmed","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/59fjxw35","slug":"tamim-ahmed-ruet","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-04T16:24:57.179Z","latestAt":"2026-10-04T16:24:57.179Z"},{"id":"01a107bb-1ec7-73df-bda3-301a19121feb","type":"creator.followed","target":{"type":"creator","id":"09bc3e24-752b-4a1b-97c2-ab8d755f63b8","preview":"Tauhid Hasan","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/09bc3e24-752b-4a1b-97c2-ab8d755f63b8/4taurhlo","slug":"tauhiduiux","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"4a178cd3-7094-477d-9edb-4d9cdd60feeb","name":"Tamim Ahmed","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/59fjxw35","slug":"tamim-ahmed-ruet","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-04T16:24:26.051Z","latestAt":"2026-10-04T16:24:26.051Z"},{"id":"01a107bb-1c84-746c-9206-8bce2346f15f","type":"creator.followed","target":{"type":"creator","id":"830039ba-56b1-42fc-a371-361e8f7a1e4c","preview":"RedDevs","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/70334/avatar-q9VjO21hdl19yEZkkQj3EgY306N2Yq.jpg","slug":"reddevs","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"4a178cd3-7094-477d-9edb-4d9cdd60feeb","name":"Tamim Ahmed","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/59fjxw35","slug":"tamim-ahmed-ruet","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-04T16:24:25.417Z","latestAt":"2026-10-04T16:24:25.417Z"},{"id":"01a107bb-19b5-70fc-b551-6157e537ce13","type":"creator.followed","target":{"type":"creator","id":"d7b633f0-85d0-4e75-b61f-08c45984e34b","preview":"PixlForm®","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/d7b633f0-85d0-4e75-b61f-08c45984e34b/pdzpgzrh","slug":"pixl-form","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"4a178cd3-7094-477d-9edb-4d9cdd60feeb","name":"Tamim Ahmed","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/59fjxw35","slug":"tamim-ahmed-ruet","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-04T16:24:24.750Z","latestAt":"2026-10-04T16:24:24.750Z"},{"id":"01a107bb-132a-7352-a576-2537bc71088a","type":"creator.followed","target":{"type":"creator","id":"f478b0de-3860-430f-9abb-62a43584a990","preview":"Farhad Ahmed","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/f478b0de-3860-430f-9abb-62a43584a990/1j68mb2i","slug":"design-with-farhad","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"4a178cd3-7094-477d-9edb-4d9cdd60feeb","name":"Tamim Ahmed","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/59fjxw35","slug":"tamim-ahmed-ruet","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-04T16:24:23.078Z","latestAt":"2026-10-04T16:24:23.078Z"},{"id":"01a0c0d4-e2f2-70dc-82cf-078bf0186d1c","type":"component.created","target":{"type":"component","id":"jkM0fh3YOkijctV4icuV","preview":"Apparel Designer","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/01a0c0d1-9ae5-75b9-af8b-29104fe7618a.png","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"4a178cd3-7094-477d-9edb-4d9cdd60feeb","name":"Tamim Ahmed","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/59fjxw35","slug":"tamim-ahmed-ruet","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"component","visibility":"public","startedAt":"2026-09-20T21:59:32.338Z","latestAt":"2026-09-20T21:59:32.338Z"},{"id":"01a01180-052e-72cb-a1aa-8e5adf742363","type":"template.liked","target":{"type":"template","id":"70558","preview":"ReoGreen","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7ec6ed9d-d5c7-40c9-9034-42ec00068627/019fc0b0-aa44-7370-9bc3-e7a3ba6cc105.jpg","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"4a178cd3-7094-477d-9edb-4d9cdd60feeb","name":"Tamim Ahmed","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/59fjxw35","slug":"tamim-ahmed-ruet","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"template","visibility":"public","startedAt":"2026-08-17T20:53:17.727Z","latestAt":"2026-08-17T20:53:17.727Z"},{"id":"01a0117f-da9f-77cf-891c-bcacc2efb23b","type":"template.liked","target":{"type":"template","id":"50971","preview":"HandGrid","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/b764a613-a73c-4e1c-bee9-33b53ec67ce6/01a0ec17-9c03-715b-861b-91703a649223.png","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"4a178cd3-7094-477d-9edb-4d9cdd60feeb","name":"Tamim Ahmed","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/59fjxw35","slug":"tamim-ahmed-ruet","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"template","visibility":"public","startedAt":"2026-08-17T20:53:06.838Z","latestAt":"2026-08-17T20:53:06.838Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}],"$inf$posts:4a178cd3-7094-477d-9edb-4d9cdd60feeb:/unified/posts/?creator=4a178cd3-7094-477d-9edb-4d9cdd60feeb&with=reposts":[{"data":[{"id":"01a0c0d4-e0dd-7139-8a79-168ffe8f5ead","title":null,"body":"

Apparel Designer is live. Let visitors upload a garment, add text and art, change its color and export the design.

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Apparel Designer is live. Let visitors upload a garment, add text and art, change its color and export the design."}]}]},"author":{"framerUserId":"4a178cd3-7094-477d-9edb-4d9cdd60feeb","name":"Tamim Ahmed","slug":"tamim-ahmed-ruet","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/59fjxw35","followed":false,"followsYou":false},"media":[],"resources":[{"id":"jkM0fh3YOkijctV4icuV","resolved":true,"title":"Apparel Designer","body":"$51","bodyJson":{"type":"doc","content":[{"type":"customHeading","content":[{"type":"text","text":"Custom T-shirt & Apparel Designer","marks":[{"type":"code"}]}],"attrs":{"level":1}},{"type":"customHeading","content":[{"type":"text","text":"Let visitors design custom clothing with text, images and colors"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Apparel Designer is an interactive design tool for Framer. Visitors upload front and back images of any garment, then customize it right on your site: change the color, add text, place their own images or logos, and export the finished design."}]},{"type":"paragraph","content":[{"type":"text","text":"Built for boutiques, print-on-demand shops, merch stores and custom apparel brands that want visitors to design their own products."}]},{"type":"customHeading","content":[{"type":"text","text":"FEATURES"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"- Works with any garment: dresses, tops, hoodies, tees and more"}]},{"type":"paragraph","content":[{"type":"text","text":"- Front and back views for full-garment designs"}]},{"type":"paragraph","content":[{"type":"text","text":"- Custom color picker to recolor the garment"}]},{"type":"paragraph","content":[{"type":"text","text":"- Text tool with 16 fonts, bold, italic and adjustable font size"}]},{"type":"paragraph","content":[{"type":"text","text":"- Image and logo upload (up to 8 MB)"}]},{"type":"paragraph","content":[{"type":"text","text":"- Layers panel to select, arrange and manage design elements"}]},{"type":"paragraph","content":[{"type":"text","text":"- Undo and redo"}]},{"type":"paragraph","content":[{"type":"text","text":"- One-click design export"}]},{"type":"paragraph","content":[{"type":"text","text":"- Works best with transparent PNG product images"}]},{"type":"customHeading","content":[{"type":"text","text":"TYPICAL USE CASES"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"- Custom dress and boutique design pages"}]},{"type":"paragraph","content":[{"type":"text","text":"- Print-on-demand and merch stores"}]},{"type":"paragraph","content":[{"type":"text","text":"- Team, club and event apparel ordering"}]},{"type":"paragraph","content":[{"type":"text","text":"- Mockup and preview tools for clothing brands"}]},{"type":"paragraph","content":[{"type":"text","text":"- Product customizers for online shops"}]},{"type":"customHeading","content":[{"type":"text","text":"HOW TO USE"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"1. Copy the component into your Framer project."}]},{"type":"paragraph","content":[{"type":"text","text":"2. Drag Apparel Designer onto your canvas and resize it."}]},{"type":"paragraph","content":[{"type":"text","text":"3. In the properties panel, add your own front and back garment images"},{"type":"text","text":" [Transparent Background + White image]","marks":[{"type":"bold"}]},{"type":"text","text":"."}]},{"type":"paragraph","content":[{"type":"text","text":"4. Publish your site and try the designer in the live preview."}]},{"type":"customHeading","content":[{"type":"text","text":"TIPS"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"- "},{"type":"text","text":"Use PNG images with a transparent background","marks":[{"type":"bold"}]},{"type":"text","text":" so color changes look clean."}]},{"type":"paragraph","content":[{"type":"text","text":"- Keep front and back images the same size for the best alignment."}]},{"type":"paragraph","content":[{"type":"text","text":"- Test uploads and export in the live preview, not only on the canvas."}]},{"type":"paragraph","content":[{"type":"text","text":"Need help? Contact me at ["},{"type":"text","text":"tamimahmedruet@gmail.com","marks":[{"type":"bold"}]},{"type":"text","text":"]."}]},{"type":"paragraph"}]},"introduction":"Custom T-shirt & Apparel Designer","slug":"apparel-designer","author":{"framerUserId":"4a178cd3-7094-477d-9edb-4d9cdd60feeb","name":"Tamim Ahmed","slug":"tamim-ahmed-ruet","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/59fjxw35","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/4a178cd3-7094-477d-9edb-4d9cdd60feeb/01a0c0d1-9ae5-75b9-af8b-29104fe7618a.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":3200,"height":2400}}],"post":null,"createdAt":"2026-09-20T21:59:31.189Z","updatedAt":"2026-10-05T16:45:35.846Z","publishedAt":"2026-09-20T21:59:31.187Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://appareldesigner.framer.website/","price":"9","paymentUrl":"https://contra.com/products/yyqZzYvZ-custom-apparel-designer","workshop":false,"categories":[{"id":"7677fa83-43ce-41a2-a3fe-db438ec0fd33","name":"Interactive","slug":"interactive"}],"lastSaveId":"NTZ2DPkRtQkNUe2T16HG","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":7,"liked":false},"comments":{"count":1},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-09-20T21:59:31.805Z","updatedAt":"2026-09-20T21:59:31.805Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}]}},"children":"$L52"}]