Urbanza — Tailwind CSS Streetwear Template (HTML)

About This Item

Weekly sneaker drops need a site that knows what day it is. Urbanza is a Tailwind CSS streetwear template for a brand that releases a pair every Saturday, runs raffles for sell-outs, and also sells decks, hoodies and gift vouchers. Its styles come from Tailwind CSS 4.

Drop Calendar and Raffle Entry in a Tailwind CSS Streetwear Template

Drops are the core of this store, so the template works out their status from the visitor’s date. Each one shows as sold out, live now, raffle open or coming up.

• Drop Calendar: a sneaker every Saturday at 10:00 from a line-up of 8, plus the apparel capsule and the deck series on their Fridays.
• Drop Details & Raffle Entry: the window opens Monday, closes Thursday night and shows results Friday at noon.
• Raffles: the next four raffles, plus your own entries and the result after the draw.

Entry takes four steps: size, details, delivery or pickup, and confirm. Each email gets one entry, and the odds update live in all 13 sizes. The next drop also counts down in every top bar.

Three Streetwear Home Pages

The template has 3 home page designs, and each one leads with a different part of the business.

• Home 01, The Drop: a full-screen slider with this week’s drop counting down, then a sneaker that turns 360° as you scroll.
• Home 02, Skate & Street: a split hero, a deck wall, and a deck that flips as its section travels.
• Home 03, Sneaker Wall: every pair on the wall with the sizes left, then a hoodie back print that screens on in three passes.

Size Guide, Build A Complete and Sneaker Care

Sizing causes many returns in apparel, so the Size Guide turns foot length and fit into UK, US and EU sizes. A chest measurement gives a regular or boxy cut. You can keep the answer, and the product pages then start on that size.

Build A Complete picks a deck by your shoe size, then trucks, wheels, bearings, grip and assembly. Price, weight and height update live. Gift Vouchers run from £10 to £500 on three card designs. Sneaker Care lists 7 services priced per pair, with a ready date counted from drop-off.

Shop, Cart and Order Tracking

The Shop holds 20 products in 6 categories, and every colourway shows stock in each size. Filters cover size, colour and price, and there is also search and quick view. A low-stock dot names the sizes left. This Tailwind CSS streetwear template adds a bag, a coupon, a UK shipping meter, collect in store, checkout and a wishlist. A currency switch for pounds, dollars and euros changes every price.

The 34 pages also include Product Details for sneakers and apparel, Lookbook, Look Details, Journal, The Crew, Rider Profile, FAQ, Contact, My Account, Login, Register, Coming Soon and a 404 page. Light and dark themes both work, and every page has a right-to-left version.

Editing Drop Calendar and Shop Styles With Tailwind CSS 4

The brand palette, typefaces and spacing live in a single Tailwind theme, so one edit there updates the Drop Calendar, the Shop and every other page. Hover and focus states appear in the markup beside each element’s default look, which makes a size button simple to read and adjust. Each section also keeps its styling inside its own HTML. If you copy the raffle band from a home page onto another page, it keeps its appearance.

The finished pages open directly from the folder. The Tailwind source comes along too, so you can adjust the styles and build them again. The preview photos are absent from the package, and neutral placeholders sit where they were. Motion comes from WebGL Tunnel Lights, three.js models of a sneaker and a deck, Swiper sliders and Fancybox popups, with prefers-reduced-motion support. Documentation is included.