Creative Gadgets Store · Multi-Market Brand System
A unified visual language for groov.store, groov.nz, and groov.hk — anchored in Futura geometry, bold restraint, and the energy of creative technology.
GROOV is the curator of creative technology across South-East Asia and the Pacific. The brand sits at the intersection of music culture, design craft, and intelligent gadgetry — always informed, never loud.
Curator, Not Retailer
GROOV hand-picks instruments, tools, and devices that share a design philosophy. Every product earns its place. The brand voice inherits this selectivity — confident, purposeful, never promotional.
Creative Energy
The audience makes things — music, art, code, spaces. GROOV speaks peer-to-peer, not store-to-customer. Product copy is technical and specific. Hero copy is evocative and minimal.
Geometric Precision
Inspired by Teenage Engineering's industrial clarity and Futura's geometric authority. Design is structural — grids are honest, white space is generous, and every element has a reason to exist.
Consistent brand identity, locally calibrated tone. Each storefront adapts currency, language cadence, and relevant product focus without diverging from the core visual system.
Flagship Market
Thailand groov.store
Pacific Market
New Zealand groov.nz
Asia Market
Hong Kong groov.hk
The GROOV wordmark is set in Futura Bold (or nearest geometric sans). All caps. Tracked at +0.10–0.15em. Never distorted, never placed on complex imagery without sufficient contrast.
Two typefaces. One geometric, one humanist. Futura for all display and heading contexts. DM Sans for body copy. DM Mono for labels, specs, prices, and UI metadata.
Display / Heading — Futura
ABCDEFGHIJKLMNOPQRSTUVWXYZ
0123456789 !? .,:;
Preferred: Futura PT / Futura Now
Fallback: Century Gothic → DM Mono
Body / Interface — DM Sans + DM Mono
The creative gadgets store for makers, musicians, and forward-thinking technologists.
SKU: TE-OP1F · In Stock · Processing: 3–10 Days · Free TH Shipping ฿15,000+
A dark-first palette rooted in off-blacks and warm whites, elevated by three accent colours drawn from the products GROOV sells. Yellow is primary action. Orange signals energy and scarcity. Teal signals availability and calm.
Yellow — Use For
Orange — Use For
Teal — Use For
All UI components follow a flat, structural aesthetic with sharp corners (no border-radius unless explicitly stated), 1px borders, and generous padding. Interactive states use colour and position shifts, not shadows.
Button System
Primary
Yellow on Black. Main purchase CTAs only.
Secondary
White outline. Add to cart, secondary actions.
Ghost
Dark rule border. Navigation, pagination.
Urgent
Orange fill. Scarcity, limited editions, sales.
Available
Teal fill. Confirm availability, in-stock state.
Product Card
Teenage Engineering
EP-40 Riddim n' Ting
Ray-Ban × Meta
Wayfarer Gen 2
Pimax
Crystal Super VR Headset
Spacing Scale
Design Do & Don't
✓ Do
Headings at every level (H1–H3) should use Futura Bold, uppercase, with tight or negative letter spacing. This preserves the industrial, geometric character of the brand.
✗ Don't
Do not combine border-radius cards with square-corner buttons in the same component cluster. The GROOV system is consistently square and structural. Rounded corners are reserved for avatar images and pills only.
✓ Do
Product shots on #111111 or #0A0A0A let the objects pop naturally. Avoid white or light card backgrounds except where a product is primarily black/dark.
✗ Don't
Groov Yellow (#E8D44D) fails WCAG contrast ratios against white backgrounds. It is designed exclusively for use on dark (#111 or darker) backgrounds. On light backgrounds, use black or dark grey instead.
✓ Do
The 2px gap between product cards and section blocks serves as a visual rule line — a structural element of the design system inspired by industrial catalogues and hardware UI.
✗ Don't
GROOV's audience is technically literate. Avoid hyperbolic phrases like "revolutionary" or "game-changing." Instead, lead with specifications and genuine functionality.
GROOV writes like a knowledgeable friend who happens to run the best gear shop in town. Confident without being boastful. Technical without being alienating. All product descriptions use sentence case (not title case). All UI labels use uppercase.
✓ Approved Tone
"EP-40 riddim n' ting — a powerful sampler built for dub, dancehall, and live performance."
Specific. Technical. Lowercase where Teenage Engineering uses it. Mirrors how the creator community talks.
✗ Avoid
"Introducing The Revolutionary EP-40! Experience The Future Of Music Today!"
Title case inflation, exclamation abuse, vague superlatives — all undermine GROOV's credibility as a specialist store.
✓ Approved Tone
"Only 3 left. Processing time: 3–10 business days."
Honest, direct scarcity. No artificial urgency language. Customers trust factual stock information.
✗ Avoid
"HURRY! Selling Fast! Order Before It's Gone!"
Manufactured urgency damages trust with a technically sophisticated audience. Let real scarcity speak.
✓ CTA Language
"Shop Now" · "Order Now" · "In Stock Now" · "See More" · "Buy Now"
Short, declarative. Verb + adverb. No question marks, no ellipsis. Reflects confidence in the product.
✗ CTA to Avoid
"Click Here To Find Out More!" · "Don't Miss Out..." · "Learn More About This Amazing Product"
Indirect, passive CTAs reduce click-through and conflict with the GROOV directness principle.
Sentence Case — Always
Product names follow the brand's own casing. Teenage Engineering uses all-lowercase — follow it. Other brand names use their official casing. GROOV's own UI labels are always uppercase.
Numbers & Specs
Always use numerals (not words) for measurements, prices, and quantities. Use en-dashes for ranges: "3–10 business days." Write THB prices without decimals. NZD/USD with two decimals.
Emoji Policy
Use sparingly and only in announcement banners (📢) and shipping notices (🚚). Never in product titles, headings, or CTA buttons. Maximum one emoji per banner message.
GROOV imagery respects the products being sold. Product shots are clean, dark-background preferred. Lifestyle imagery shows real-world creative use. No stock-photo aesthetics — all visuals should feel considered and editorial.
Product Photography
Hero / Banner Imagery
What To Avoid