Chill Pavement Design directions 7 September 2026

Three ways the shop could look.

Nothing is built yet. This is the look-and-feel stage: three complete, deliberately different visual worlds for the same shop. Each one shows the home page, a product page, the bag, and how it looks on a phone, because the shop working is the part that matters most. Pick one, or pull the parts you like from across all three. There is a table near the bottom for exactly that. The shop underneath works the same either way.

Everything you see is placeholder. The garment shapes are stand-in silhouettes, not product photos, and the product names, codes and prices are examples so the layouts read like a real shop. Your actual logo, photos and products drop straight in.

What the good shops actually do

Two of your three favourites are off-the-shelf shops.

Tamed Psychotic runs a bought Shopify theme called Prestige with two free Google fonts. House of Errors runs a modified Shopify theme with a paid font kit. Only Karo Crafts is built from scratch, and that is the expensive one. So what makes a shop feel costly is not the platform. It is a handful of decisions, and most of them are free.

01  Let people change the view

Acronym's whole navigation is SORT / IMG / TXT. You choose how to look at the catalogue: a wall of pictures, or a plain spreadsheet of every item with sizes, colours and stock. Nobody selling clothes in South Africa does this.

02  Part numbers, not names

Acronym's grid shows J106-DS and SP62-M. No names, no prices. It reads like a parts catalogue, which makes the clothes feel engineered rather than merchandised.

03  A menu that reads like a tracklist

Palace stacks its drops in one column and lights the live one in red as you scroll. The nav is a floating black pill and there is nothing else on the screen. The photography does all the work.

04  Colour as rooms

House of Errors' blue #254487 is never a highlight. It takes a whole section, background included. A section either is that colour or it is not. That is how we use red.

05  Extreme type scale

House of Errors sets body text at 12px and headlines up to 149px from one ratio. Nothing sits in the middle. That gap is what reads as expensive, and it is free.

06  A title that reads through the pictures

Dime pins one word in the middle of the screen in the same colour as the background, so it is invisible until a photo scrolls behind it. Pure CSS, no library, and it makes scrolling feel authored.

07  A clock on the drop

Corteiz pins a live countdown to the bottom of every page: 02 : 01 : 16 : 58. It turns a small range into an event, and it is about fifteen lines of code.

08  Red as a band, not as text

Baker fills the entire header block with #E3201A and puts the logo on top in black. Red type on white looks like a sale. A red block with type on it looks like a brand.

09  Real photography

Tamed Psychotic's image files are named DSC05300.jpg and IMG_2849.jpg. Camera and phone originals, unretouched. That mix is exactly why it cannot read as AI. This part is on you and a mate with a camera.

Direction 01

Kerb Index

The shop as municipal infrastructure. Road paint, kerb stripes, hazard chevrons, and a catalogue you can flip between pictures and a live stock table. Every piece carries a part number and a spec sheet. It is a clothing brand that behaves like a parts department.

#0B0C0BTar, page
#151815Panel
#E2251CPaint red, fill
#E8B400Hazard yellow, states
#F2EFE6Warm white, type
Display & body
IBM Plex Mono 600
In use
KRB-04 / HEAVYWEIGHT HOODIE / 420 GSM / 14 IN STOCK / R750.00
Why mono
One typeface for the whole site. Free, instantly technical, and prices, sizes and stock counts line up in columns without any effort.

Home page  /  IMG view

CHILL PAVEMENT IMGTXTSORT INFOBAG 02

Everything
we made

ITEMS IN INDEX18
KRB-01750
KRB-02390
KRB-03320
KRB-04OUT
KRB-05450
KRB-06780
KRB-07390
KRB-08320
KRB-09450
KRB-10OUT
KRB-04 RESTOCK FRIDAY    FREE COURIER OVER R900    KRB-10 SOLD OUT IN 4 HOURS    KRB-04 RESTOCK FRIDAY    FREE COURIER OVER R900   

Same page  /  TXT view. One click, no pictures, everything at once

CHILL PAVEMENT IMGTXTSORT INFOBAG 02
CodeItemSizesColourwaysPriceStock
KRB-01Kerbstone Hoodie, 420gsmS M L XL R750.0014
KRB-02Tar Tee, 240gsmS M L XL R390.0031
KRB-03Stoep Cap, brushed twillOne size R320.003
KRB-04Robot Tee, 240gsmS M L XL R390.000
KRB-05Pavement Print, edition of 25A2 R450.0019
KRB-06Speed Bump Hoodie, 420gsmM L XL R780.005

KRB-01  Kerbstone Hoodie

Every product page opens with the measurements, not the marketing. Size guides stop being a popup nobody reads and become the actual product drawing.

A
Body length
72 cm
B
Chest, pit to pit
58 cm
C
Sleeve from shoulder
62 cm
D
Rib hem
6 cm
AB CD 72 CM58 CM 62 CM6 CM

Product page. The spec sheet is the product page

KRB-01 BACK TO INDEXBAG 02

Kerbstone Hoodie

KRB-01  /  420 GSM  /  CUT AND SEWN IN CAPE TOWN

R750.00

S4 left MIn stock LIn stock XLSold out
Add to bag

Stock is held for 15 minutes once you reach checkout

Fabric420gsm brushed fleece, 80/20
FitBoxy, size down for regular
PrintScreen print, three colours
MadeCape Town, batch of 40
CareCold wash, inside out, hang dry

On a phone

IMGTXT 02

Everything
we made

IN INDEX18
KRB-01750
KRB-02390
KRB-03320
KRB-04OUT

The bag. Plain numbers, nothing trying to sell you more

Bag  /  2 items

KRB-01   Kerbstone Hoodie   MR750.00
KRB-03   Stoep Cap   One sizeR320.00
Courier, 2 to 4 working daysR95.00
TotalR1 165.00
Checkout is handled byYocoCardInstant EFTApple Pay Card details never touch this site

What makes it specific

The red and white kerb stripe and the yellow hazard chevron are real South African street objects, not decoration. Live stock counts in yellow, red at three left and struck through at zero, make a small catalogue feel urgent instead of empty.

Where it could go wrong

Cold enough to feel unfriendly if the photography is also cold. It needs warm, human, slightly messy pictures pushing against the grid. And the TXT view only impresses once there are enough products to fill it.

Best if

You want the brand to read as a serious operation, you like part numbers, and you plan to keep releasing numbered drops rather than one static range.

Direction 02

Red Robot

Named for the thing you stop at. The whole site is a red room: red is the floor and the walls, not a highlight. Drops stack up like a tracklist and the live one burns hot red while the rest sit back. Heavy italic condensed type, enormous, cropped by the edge of the screen. Loud, confident, and nothing like a template.

#8A101BRobot red, the ground
#FF3B2EHot red, live item
#12100FBlack room
#F7EDE3Warm white, type
#FFC9C4Faded pink, captions
Display
Archivo Condensed 800 Italic
Outline cut
Same face, hollow
Everything else
Archivo, 11px, very wide tracking, upper case

Home page. The list is the navigation

CHILL PAVEMENT ShopDropsInfoBag 2
View
  • Drop One  /  Kerbside
  • Drop Two  /  After School
  • Drop Three  /  Red Robot
  • Caps & Small Things
  • Art & Prints
Shot on the corner of Long and Bloem  ·  18:40

StopLookBuy

Drop three is live  ·  40 pieces only

02 : 01 : 16 : 58 Until drop three closes  ·  example countdown
Kerbstone Hoodie

R750

Robot Tee

R390

Stoep Cap

R320

Look at that
  • Instagram
  • TikTok
  • The gallery
Boring but needed
  • Delivery
  • Returns
  • Size guide
Ask us
  • FAQ
  • WhatsApp
  • Stockists
10% off
  • Join the list

Product page. The name is the poster

CHILL PAVEMENTBackBag 2

Kerbstone Hoodie

R750  ·  Drop three

Heavy fleece, boxy, printed three colours on the chest. Forty made and that is the lot.

SM LXL
Add to bag

Free courier over R900  ·  ships in 2 days

On a phone

CHILL PAVEMENTBag 2
  • Drop One / Kerbside
  • Drop Two / After School
  • Drop Three / Red Robot
  • Art & Prints
02 : 01 : 16 : 58 Until drop three closes

The bag slides in over the red

Your bag

Kerbstone Hoodie  MR750
Stoep Cap  One sizeR320
CourierR95
TotalR1 165
Checkout

Card, instant EFT or Apple Pay  ·  secured by Yoco

What makes it specific

A robot is a traffic light here and nowhere else, so the name only works for a South African brand. Red as the entire ground rather than an accent is the one thing almost no skate brand does, which is exactly why it stands out. The footer headings are written in the brand's voice instead of saying Customer Service.

Where it could go wrong

A red page can shout over the clothes. It needs the black room in the middle to breathe, and product photos shot on plain backgrounds so the garments do not fight the wall. Contrast on captions has to be watched carefully.

Best if

You want the site to feel like a party rather than a catalogue, you are dropping in batches, and you want the brand loud enough to remember after one visit.

Direction 03

Grip

The shop as a photocopied zine taped to a wall. Newsprint paper, blown-out red ink, one screaming condensed face, typewriter text, everything very slightly crooked. This is the most skate of the three and the hardest to mistake for a template.

#E8E4D9Newsprint, page
#111110Xerox black
#D8291CInk red
#E9FF4FHighlighter, rare
#DAD5C7Second paper
Display
Anton, set enormous
Everything else
Courier Prime. Reads as typed, not designed.
The move
A dot screen over the whole page and about one degree of rotation on every card. Just enough to look printed and stuck down by hand.

Home page, roughly

CHILL PAVEMENT SHOPPICSFAQBAG 2
NEW DROP OUT NOW  ★  FREE STICKER IN EVERY ORDER  ★  SHIPS COUNTRYWIDE  ★  NEW DROP OUT NOW  ★  FREE STICKER IN EVERY ORDER  ★ 

ChillPavement

Clothes, caps and art from the side of the road

Speed Bump Hoodie

R750

Robot Green Tee

R390

Stoep Cap

R320
GET 10% OFF → DROP YOUR EMAILSECURE CHECKOUT@CHILLPAVEMENT

Product page. A flyer for one thing

BACK TO SHOP BAG 2

Speed Bump
Hoodie

R750

Thick fleece. Three colour print. Boxy fit, size down if you want it normal. We made forty.

SM LXL
Add to bag

Free sticker in every order

On a phone

CHILL PAVEMENT2
NEW DROP OUT NOW  ★  FREE STICKER IN EVERY ORDER  ★  NEW DROP OUT NOW  ★ 

ChillPavement

Clothes, caps and art from the side of the road

Speed Bump Hoodie

R750

Stoep Cap

R320

The bag prints itself a receipt

Chill Pavement

ORDER 0042  ·  07/09/2026  ·  CAPE TOWN

SPEED BUMP HOODIE  M750.00
STOEP CAP  OS320.00
COURIER95.00
STICKER PACK0.00
TOTALR1 165.00

Thanks. Go skate.

What makes it specific

The crookedness is the point, and it is real CSS rotation rather than an image effect, so it stays sharp on every screen. The scrolling red strip is where sales, drops and free stickers get announced without a popup.

Where it could go wrong

Rough is a fine line from cheap. It needs strong graphics on the actual garments to carry it, and the checkout has to stay perfectly plain and legible while the rest goes loud.

Best if

You want the site to feel like the brand's own voice shouting, and you are willing to make stickers, flyers and a zine to match.

Build notes

The things that make it feel custom, and what they actually cost.

None of this needs a big budget. Most of it is a few lines of CSS. Two of them are newer browser features, so they are built as a bonus: browsers that do not support them simply show the ordinary version, and nothing breaks.

Free  ·  Sticky section titles

A heading that stays put while photos scroll behind it, in the same colour as the background so it only appears where an image passes. Plain CSS, works in every browser.

Free  ·  Drop countdown

A live clock to the next drop or the moment a drop closes. About fifteen lines of JavaScript. Working example sitting in direction 02 above.

Free  ·  IMG and TXT views

One button that swaps the picture grid for a plain stock table. It is the same data rendered twice, so it costs almost nothing and no other local brand has it.

Free  ·  Photocopy and grain

The zine texture in direction 03 is a CSS dot pattern, not an image file. It stays sharp on any screen and adds nothing to the page weight.

Cheap  ·  Your own typeface

Independent Trucks ships a font called INDYFONT. If your logo has a full alphabet, we turn those letters into a real webfont and the site then uses type that exists nowhere else. A designer draws the missing letters once.

Bonus  ·  Scroll animation

Native scroll-driven CSS animation. Works in Chrome, Edge and Safari 26; Firefox still has it behind a setting, so roughly 84 percent of visitors see it and the rest see the page sitting still. Nothing is lost.

Bonus  ·  Page transitions

Clicking a product can cross-fade instead of blinking white. Chrome, Edge and Safari 18 support it, Firefox is still building it. Where it is missing you get an ordinary page load, which is what everyone has always had.

Free  ·  Set the sale tag to black

Polar does this and it is the single cheapest tell. Every default shop theme makes the sale tag red. Changing one value stops the site looking like a template.

Mix and match

You do not have to take a whole direction.

These parts are independent. Tell me one column per row and I will build that combination. A common good answer is Grip for the personality with Kerb Index for the shop pages, because the loud stuff sells and the plain stuff ships.

Part of the site01 Kerb Index02 Red Robot03 Grip
Home page Dense catalogue, everything visible at once Drop list over full-bleed photography Big logo, taped product cards
Navigation View controls: IMG, TXT, SORT Floating black pill, always centred Black bar with a scrolling red strip
Product grid Small tiles, part numbers only Three across, cut out on black Crooked cards with tape
Product page Spec sheet with measurements drawing Name set as a poster A flyer for one item
The bag Plain table of numbers Drawer sliding over the red Printed receipt with a torn edge
Announcements Ticker along the bottom Live countdown to the drop closing Scrolling red marquee
Type IBM Plex Mono throughout Archivo condensed italic, very heavy Anton plus Courier
Photography needed Flat lays on plain ground, plus street shots Strong full-bleed images, people wearing it Phone photos are fine, rough is the point
The other question

Yes, it costs something. Not much, and not upfront.

The build is on the house. What you cannot avoid is the running cost, because taking real card payments means someone has to carry the bank side of it. Here is the honest version.

Recommended setup, first year
Domain
R100chillpavement.co.za, per year
Shop engine
R3 650Shopify Basic. About R400 a month after the first three months at roughly R18
Per sale
~R27on a R500 order. Card fee plus Shopify's cut

Hosting is free on my Cloudflare account. The whole front end, everything in these three directions, is custom code that we own. Shopify sits behind it doing the boring dangerous parts: the card payment, your orders, your stock counts, customer addresses. That means card details never touch our site, which is the single most important decision here, and it means you can add products and see orders yourself without phoning me.

Card payments run through Yoco or Paystack. Both onboard a sole trader with just an ID and a bank account, so you do not need a registered company to start.

To move

What I need from you

Prepared for Sam. Three directions, one page, nothing built yet.
Colours, fonts and layouts here are all real and ready to use. Photography and products are placeholders.