.tryon-hero { text-align: center; padding: 40px 0 24px; } .tryon-hero h1 { font-size: 2rem; } .tryon-hero p { color: var(--text-secondary); max-width: 500px; margin: 8px auto 0; font-size: .95rem; } .tryon-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; min-height: 500px; } .tryon-left { background: var(--bg-section); border-radius: 16px; padding: 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 400px; position: relative; overflow: hidden; } .tryon-left.has-photo { justify-content: flex-start; } .upload-zone { border: 2px dashed var(--glass-border); border-radius: 16px; padding: 40px; text-align: center; cursor: pointer; width: 100%; transition: .2s; } .upload-zone:hover { border-color: var(--primary); background: var(--primary-light); } .upload-zone i { font-size: 3rem; color: #9ca3af; display: block; margin-bottom: 12px; } .upload-zone p { color: var(--text-secondary); font-size: .9rem; } .upload-zone input { display: none; } .tryon-canvas-wrap { position: relative; width: 100%; height: 100%; min-height: 400px; display: flex; align-items: center; justify-content: center; } #tryonCanvas { max-width: 100%; max-height: 500px; border-radius: 8px; cursor: grab; } #tryonCanvas:active { cursor: grabbing; } .tryon-right { display: flex; flex-direction: column; gap: 12px; } .tryon-item-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 8px; overflow-y: auto; max-height: 500px; padding-right: 4px; } .tryon-item { border-radius: 12px; overflow: hidden; cursor: pointer; border: 2px solid transparent; transition: .2s; background: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.06); } .tryon-item:hover { border-color: var(--primary-light); } .tryon-item.active { border-color: var(--primary); } .tryon-item img { width: 100%; height: 80px; object-fit: cover; display: block; } .tryon-item span { display: block; padding: 4px 6px 6px; font-size: .72rem; color: var(--text); font-weight: 500; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .tryon-controls { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-top: 8px; } .tryon-controls label { font-size: .82rem; color: var(--text-secondary); } .tryon-controls input[type="range"] { flex: 1; min-width: 100px; accent-color: var(--primary); } .tryon-status { font-size: .8rem; color: var(--text-secondary); margin-top: 8px; } .loading-spinner { display: inline-block; width: 16px; height: 16px; border: 2px solid var(--glass-border); border-top-color: var(--primary); border-radius: 50%; animation: spin .6s linear infinite; vertical-align: middle; margin-right: 6px; } @keyframes spin { to { transform: rotate(360deg); } } .cat-filter { display: flex; gap: 6px; margin-bottom: 8px; flex-wrap: wrap; } .cat-filter button { padding: 5px 14px; border: 1px solid var(--glass-border); border-radius: 20px; background: #fff; font-size: .8rem; cursor: pointer; transition: .2s; } .cat-filter button.active { background: var(--primary); color: #fff; border-color: var(--primary); } @media (max-width: 768px) { .tryon-layout { grid-template-columns: 1fr; } .tryon-left { min-height: 300px; } .tryon-item-list { grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); max-height: 300px; } .tryon-hero h1 { font-size: 1.5rem; } }

AI Try-On

Upload your photo, pick a garment, and see how it looks on you — automatically.

Upload your photo
Full-body photo works best

Elegant Evening Dress Elegant Evening Dress
Casual Summer Dress Casual Summer Dress
African Print Gown African Print Gown
Office Smart Dress Office Smart Dress
Maxi Floral Dress Maxi Floral Dress
Cocktail Party Dress Cocktail Party Dress
Traditional Wear Traditional Wear
Bodycon Dress Bodycon Dress
Bridal Shower Dress Bridal Shower Dress
Tiered Ruffle Dress Tiered Ruffle Dress
Chiffon Evening Gown Chiffon Evening Gown
Classic Stiletto Heels Classic Stiletto Heels
Block Heel Pumps Block Heel Pumps
Elegant High Heels Elegant High Heels
Platform Heel Sandals Platform Heel Sandals
Kitten Heel Shoes Kitten Heel Shoes
Wedge Heels Wedge Heels
Chunky Heel Boots Chunky Heel Boots