Streetwear Drop Announcement
High-contrast, urban design featuring bold typography and dark aesthetics. Perfect for fashion drops, limited releases, and streetwear announcements.
Preview
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="ltr" lang="en">
<head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type" />
<meta name="x-apple-disable-message-reformatting" />
<style>
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;600;800&display=swap');
</style>
</head>
<body style="background-color:#0a0a0a;margin-top:auto;margin-bottom:auto;margin-left:auto;margin-right:auto;font-family:'Archivo', sans-serif">
<table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="max-width:600px;margin:0 auto">
<!-- Header -->
<tr>
<td style="padding:40px 20px">
<table width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation">
<tr>
<td style="text-align:center">
<h1 style="font-weight:800;font-size:24px;color:#ffffff;margin:0;letter-spacing:2px">STREET LEGACY</h1>
</td>
</tr>
</table>
</td>
</tr>
<!-- Hero Section -->
<tr>
<td>
<img src="https://images.unsplash.com/photo-1552346154-21d32810aba3" alt="Collection Hero" style="width:100%;height:600px;object-fit:cover" />
</td>
</tr>
<!-- Announcement -->
<tr>
<td style="padding:40px 20px">
<table width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation">
<tr>
<td style="text-align:center">
<p style="font-size:14px;color:#ff3333;margin:0 0 20px 0;letter-spacing:2px;text-transform:uppercase">New Collection Drop</p>
<h2 style="font-size:36px;font-weight:800;color:#ffffff;margin:0;letter-spacing:1px;text-transform:uppercase;line-height:1.2">CONCRETE JUNGLE SS24</h2>
<p style="font-size:16px;color:#999999;margin:20px 0 0 0;line-height:1.5">Available worldwide June 1st, 12PM EST</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- Product Grid -->
<tr>
<td style="padding:20px">
<table width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation">
<tr>
<td style="padding:10px">
<img src="https://images.unsplash.com/photo-1556821840-3a63f95609a7" alt="Product 1" style="width:100%;height:300px;object-fit:cover;margin-bottom:15px" />
<h3 style="font-size:16px;font-weight:600;color:#ffffff;margin:0 0 5px 0">VINTAGE WASH HOODIE</h3>
<p style="font-size:14px;color:#999999;margin:0">$120 USD</p>
</td>
<td style="padding:10px">
<img src="https://images.unsplash.com/photo-1578681994506-b8f463449011" alt="Product 2" style="width:100%;height:300px;object-fit:cover;margin-bottom:15px" />
<h3 style="font-size:16px;font-weight:600;color:#ffffff;margin:0 0 5px 0">CARGO TECH PANTS</h3>
<p style="font-size:14px;color:#999999;margin:0">$145 USD</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- Collection Details -->
<tr>
<td style="padding:40px 20px">
<table width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="border:1px solid #333333">
<tr>
<td style="padding:40px;text-align:center">
<h3 style="font-size:24px;font-weight:800;color:#ffffff;margin:0 0 20px 0;text-transform:uppercase">Collection Details</h3>
<p style="font-size:16px;line-height:1.6;color:#999999;margin:0">Limited to 500 pieces per item. Each garment features custom hardware, premium materials, and numbered authenticity tags.</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- Lookbook -->
<tr>
<td>
<img src="https://images.unsplash.com/photo-1599590984817-0c15f31b1fa5" alt="Lookbook" style="width:100%;height:400px;object-fit:cover" />
</td>
</tr>
<!-- Launch Info -->
<tr>
<td style="padding:40px 20px">
<table width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="background:#111111">
<tr>
<td style="padding:40px;text-align:center">
<h2 style="font-size:24px;font-weight:800;color:#ffffff;margin:0 0 20px 0">DROP DETAILS</h2>
<p style="font-size:16px;line-height:1.6;color:#999999;margin:0 0 20px 0">Early access for members begins May 31st at 6PM EST.</p>
<a href="#" style="display:inline-block;padding:15px 40px;background:#ff3333;color:#ffffff;text-decoration:none;font-weight:600;font-size:14px;letter-spacing:1px">JOIN MEMBERS LIST</a>
</td>
</tr>
</table>
</td>
</tr>
<!-- Locations -->
<tr>
<td style="padding:40px 20px">
<table width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation">
<tr>
<td style="text-align:center">
<h3 style="font-size:18px;font-weight:600;color:#ffffff;margin:0 0 20px 0;text-transform:uppercase">Available At</h3>
<p style="font-size:14px;line-height:1.6;color:#999999;margin:0">
NYC • LA • LONDON • TOKYO<br/>
+ ONLINE
</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- Footer -->
<tr>
<td style="padding:60px 20px;text-align:center;border-top:1px solid #333333">
<table width="100%" max-width="300px" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="margin:0 auto">
<tr>
<td style="padding:0 15px">
<a href="#" style="font-size:14px;color:#999999;text-decoration:none">INSTAGRAM</a>
</td>
<td style="padding:0 15px">
<a href="#" style="font-size:14px;color:#999999;text-decoration:none">TWITTER</a>
</td>
<td style="padding:0 15px">
<a href="#" style="font-size:14px;color:#999999;text-decoration:none">DISCORD</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>