Shop Nation · Internal reference
Email design kit
Brand colors, type, ready-made modules and image assets for building Shop Nation emails in Klaviyo. Match each module in Klaviyo's drag-and-drop editor using the specs next to it, then copy the image links straight into Klaviyo image blocks.
01 · Tokens
Colors & type
Charcoal
Text, dark bands, outline buttons
Shop orange
Primary CTA only, one per email
Off-white
Email body background
Sand
Alt bands, promo blocks
Steel
Rules and icons only
Hairline
Card and divider borders
Headline · Chakra Petch 700 · uppercase
Stop sweeping.
Email H1 36px / 40px · H2 24px / 28px · tracking 0.026em
Fallback: Arial Black, Arial, Helvetica, sans-serif
Body · Inter 400
Bolt-on dust chutes engineered for your exact miter saw. Catch the dust at the blade, not on the floor.
16px / 1.55 · charcoal #282828
Fallback: Helvetica, Arial, sans-serif
Label · IBM Plex Mono 400
New · Fits DWS779 / DWS780
Eyebrows, prices, badges · 12–13px · tracking 0.08em
Fallback: Courier New, monospace
Buttons
Primary: bg #f37220 · text #282828 (never white) · radius 4px · padding 14/28
Secondary: transparent · 1px #282828 border
02 · Modules
Email building blocks
Every module is shown at true email width (600px). Stack them in any order. Most campaigns are header → hero → one or two content modules → footer.
M1
Header
- Bg #282828 · padding 24px
- Logo: your PNG artwork, 160px wide (upload at 320px)
- Nav links: mono 12px, #f8f6f2
M2
Hero
- Image full-bleed 600px (upload 1200px)
- Text block: bg #f8f6f2 · padding 40/32
- Eyebrow mono 12px · H1 36px · body 16px
- One orange button. No other orange in view.
New for DeWalt DWS779 / DWS780
Stop sweeping.
Start building.
A bolt-on dust chute engineered for your exact saw. It catches dust at the blade with zero modifications and no lost cut capacity.
Shop the chute · $55.00M3
Proof band
- Bg #282828 · 3 columns (stack on mobile)
- Icons: orange, 28px. Export as PNG for email.
- Label mono 12px uppercase · #f8f6f2
Fits your exact saw
5-min install
Spare parts available
M4
Product grid
- 2 columns · 16px gap · padding 32/24
- Card: white · 1px #e5e7eb · radius 8px
- Price mono 14px · outline button (orange stays for hero)
- Tip: Klaviyo's product block can pull these from your catalog
Find the chute for your saw
M5
Promo code
- Bg #e5dcca · padding 40/32
- Code box: white · 2px dashed #282828 · mono 24px
- Swap the sample code for your Klaviyo coupon
This week only
15% off your first upgrade
Enter at checkout. Sample code, replace with your coupon.
M6
Image + text row
- 2 columns 50/50, stack on mobile
- Square image (upload 600px) · text padding 24px
- Alternate image side per row
Install in minutes
Bolts into the stock mount
No drilling, no cutting. It uses the same mounting point as your factory chute and comes off just as easily.
See how it works →M7
Story band
- Atmospheric image, then text on #282828
- Keep text out of images. Outlook can't layer text on backgrounds.
- H2 28px · body #f8f6f2 at 80%
A shop that doesn't suck.
Except the dust.
Fine dust is the stuff you don't see, and it's the stuff your lungs remember. Catch it at the source.
M8
Wide banner
- 16:9 image full-bleed (upload 1200px)
- Caption row: mono 12px + text link
- Good for restock, new fitment or how-to sends
Now fitting Bosch Axial Glide · Gen II
Shop →M9
Footer
- Bg #282828 · padding 32/24 · centered
- Social icons #a0a7a9, 20px
- Use Klaviyo's built-in unsubscribe + address tags
Shop Nation Store · Company address
You're getting this because you signed up at shopnationstore.com. Unsubscribe · Preferences
03 · Downloadable graphics
Ready-to-upload PNGs
What you see is exactly what downloads. Each graphic exports at 2x (1200px wide) so it stays sharp at 600px. Upload it to Klaviyo's image library, drop it in a full-width image block and add the alt text listed.
G1 · Version A
Logo header · Solid
- 1200 × 280 PNG · display at 600px
- Solid charcoal #282828 · white logo
- Tagline Chakra Petch 700 · orange hairlines
- Alt text: Shop Nation · Shop Greatness
G1 · Version B
Logo header · Grid
- 1200 × 280 PNG · display at 600px
- Charcoal with a faint 40px blueprint grid, fading to the edges
- Orange crop marks in the corners
- Alt text: Shop Nation · Shop Greatness
G1 · Version C
Compact header · Dark
- 1200 × 160 PNG · display at 600 × 80
- Solid charcoal #282828 · white logo, no tagline
- Best for flows and transactional sends
- Alt text: Shop Nation
G1 · Version D
Compact header · Light
- 1200 × 160 PNG · display at 600 × 80
- Off-white #f8f6f2 · dark logo, no tagline
- On an off-white email body, add a 1px #e5dcca divider below it
- Alt text: Shop Nation
G2
Proof band
- 1200 × 300 PNG · display at 600px
- Bg #282828 · orange icons · mono labels
- Alt text: Fits your exact saw · 5-min install · Spare parts available
G3
Customer stats
- 1200 × 720 PNG · display at 600px
- Off-white ground · charcoal icons · orange highlights
- Alt text: 100,000+ customers love their workshops. 10,000+ 5-star reviews, crafted proudly in the USA, 30-day easy returns.
04 · Image assets
Email-ready imagery
Copy a link into a Klaviyo image block, or download it and upload it to your Klaviyo image library so it's stored with your account.
Lifestyle & banners
Product photos & links
Dust Collection Chute for DeWalt DWS779/780 Sliding Miter Saw
$55.00
Dust Collection Chute for Bosch Axial Glide Miter Saw
$57.00
Dust Collection Chute for Ridgid 12" Sliding Miter Saw (R4222)
$52.00
Dust Collection Chute for Dewalt DW715/716 12" Non-Sliding Miter Saw
$53.00
05 · Klaviyo setup
Set it once, reuse forever
Save brand styles
In Klaviyo's brand library, set the six hex colors above, body text #282828 and link color #282828.
Add web fonts with fallbacks
Add Chakra Petch for headings and Inter for body as custom fonts. Outlook shows the fallbacks: Arial and Helvetica.
Style one button, save it
Use a Klaviyo button block: bg #f37220, text #282828, radius 4px, padding 14/28. Save it as a universal block.
Save modules as universal blocks
Build M1 header and M9 footer once as universal blocks so every campaign stays consistent.
Upload images at 2x
Upload images at 1200px wide for a 600px email so they look sharp on retina screens. Always add alt text.
Keep copy live
Put headlines and CTAs in text blocks, never inside images. They stay readable with images off and on dark mode.