Brand Identity System — 2026
Next-Generation Auto Detailing
Identity
Logo Variations
Official PNG Emblem
MCDETAIL'CAR
Glow Edition
MCDETAIL'CAR
Chrome
MCDETAIL'CAR
Light Background
Color System
Brand Palette
Primary Colors
Electric Blue
#1A72FFBright Blue
#4096FFSky Accent
#74B5FFDeep Navy
#0A3E8CAccents & Neutrals
Premium Gold
#C8A84BVoid Navy
#040912Abyss
#0A1630Chrome
#A0B0C8Type System
Typography
Plus Jakarta Sans — Display / Headlines
Premium Detailing.
AaBbCcDdEeFfGgHhIiJjKkLl 0123456789
Light weight subheading for layered hierarchy
Used for: Logo, Hero headlines, CTA buttons, Section titles
Inter — Body & UI
Clean legibility.
AaBbCcDd 0123456789
Used for: Descriptions, labels, nav, data
Exo 2 — Accent / Technical
10× Performance.
AaBbCcDd 0123456789
Used for: Stats, taglines, badges, specs
Component Library
UI Elements
Buttons
Form Fields
Badges
Professional
Premium Tier
Verified
Certified
Eco-Friendly
Metric Cards
Services Completed
0+
↑ +12.4% this month
85%
Monthly TargetAhead of schedule
Client Satisfaction
0%
↑ +0.3% vs last quarter
98%
Top RatedPrague region #1
5-Star Reviews
0+
↑ +48 this week
70%
Goal: 2,000On track for Q4
Feature Cards
Service — 01
Ceramic Coating
9H hardness with hydrophobic properties. UV-resistant formula lasting up to 5 years of flawless protection.
Service — 02
Paint Correction
Multi-stage machine polishing eliminates swirls, scratches and oxidation. Showroom-grade gloss restored.
Service — 03
Interior Detailing
Deep extraction cleaning, leather conditioning, and ozone odour elimination. Every surface, perfected.
Toggles
SMS Booking Reminders
Email Completion Reports
Before / After Photo Gallery
Moodboard
Visual Inspiration
The design language draws from the world's most premium digital experiences — deep navy, vivid electric blue energy, and glowing interfaces that communicate precision and prestige.
SaaS UI / Dark Hero
Hero-Level SaaS Aesthetic — Agex
Central blue beam, floating dashboard, deep navy. The template for how premium digital products introduce themselves to the world.
Atmosphere / Palette
Cosmic Blue — The Brand Palette
Deep void fading into electric blue horizon. This is exactly the emotional gradient MCDETAIL'CAR communicates — darkness, precision, and a radiant edge.
Glassmorphism / Cards
Flowing Light & Glass
Blue silk aurora waves over dark canvas. The mood for every card and component in the brand system.
Dashboard / 3D Depth
3D Floating Cards — SerQ
Glassmorphic panels at depth, electric blue glowing route lines, layered shadows. The direct reference for MCDETAIL'CAR's booking interface.
Particles / Precision
Particle Light & UI Detail
Scattered light particles on deep blue, crisp terminal panels, precision badges. The micro-detail quality standard every MCDETAIL'CAR screen must reach.
Applications
Brand In The Wild
Digital
Website & Landing Page
Dark immersive site with glassmorphic sections, animated ambient lighting, before/after sliders, and a live booking system with real-time availability.
Mobile
Booking App
Native iOS/Android with vehicle profiles, live service tracking, push notifications, and a tiered loyalty rewards system.
Premium
Metal Business Cards
CNC-cut black metal cards with laser-etched logo, UV spot coating, and gold foil accents — a tactile statement of premium positioning.
Physical
Staff Uniforms
Dark tactical-fit uniforms with reflective logo placement, embroidered detailing, and premium fabric that signals elite service standards.
Marketing
Video Content
Cinematic before/after reels, slow-motion detailing macros, branded motion graphics — engineered for Instagram and TikTok virality.
Premium
Service Packaging
Matte black magnetic boxes with branded microfibre cloth — an unboxing moment clients photograph and share without prompting.
Standards
Brand Guidelines
Visual Identity
Dark-first design — every execution leads with deep navy or void black backgrounds.
Glassmorphism — frosted card surfaces with 1px shimmer top borders.
Ambient light — radial beam and aurora glows behind key elements, never flat or harsh.
Gold is rare — reserved strictly for Premium tier or highest-priority CTA moments.
Voice & Tone
Confident, not arrogant — speak from authority, not superiority.
Precise language — "9H hardness ceramic" over "really strong coating".
Results first — lead with outcome, follow with process and method.
Minimal copy — if a word can be cut without losing meaning, cut it.
Photography
Rim-lit subjects — vehicles backlit with electric blue for cinematic depth.
Macro details — water beads, ceramic reflection, leather pores close-up.
Blue cool grade — subtle cool tone in post. Never warm, never orange-leaning.
Dark studio — controlled environment. No natural blowout or overexposure.
Website Blueprint
Full Website Plan — MCDETAIL'CAR
A premium, authority-first website built around authentic footage, social proof, and a no-price-until-quote strategy. Every section is engineered to position MCDETAIL'CAR as the undisputed expert in the Clermont Créans area and convert visitors into quote requests.
Site Architecture
Page — 01
Accueil
Landing page flagship. Hero cinématique, services aperçu, before/after slider, avis Google, CTA devis. La vitrine principale.
Page — 02
Services
Page dédiée aux 7 prestations. Chaque service a son bloc détaillé avec photos authentiques, bénéfices, et bouton "À partir de..." + devis.
Page — 03
Réalisations
Galerie before/after interactive, vidéos cinématiques des résultats. Le terrain de jeu de la preuve sociale visuelle. Aucun texte ne vaut ces images.
Page — 04
À Propos
L'histoire authentique derrière la marque. Photos en action, formation, passion. Humanise l'expertise et crée la confiance avant le premier contact.
Page — 05
Demander un Devis
Formulaire premium : véhicule, service souhaité, date, photos. Aucun prix affiché — chaque devis est personnalisé. Pipeline de conversion principal.
Navigation
Navbar Sticky
Logo gauche, liens centraux (Services / Réalisations / À Propos), bouton CTA "Demander un Devis" doré à droite. Glassmorphic sur scroll.
Global
Footer
Logo, adresse (20 rue Nationale, Clermont Créans), téléphone (+33 6 38 35 10 80), liens réseaux sociaux, liens légaux. Clean et autoritaire.
Technical
SEO Local & Perf
Schema markup local business, Google My Business embed, meta OG, site rapide. Cible "detailing voiture Clermont Créans" et environs Sarthe.
Accueil — Section par Section
Décomposition de chaque bloc de la page d'accueil, dans l'ordre d'apparition, avec l'objectif de conversion de chaque section.
Section 01
Hero Principal
Priorité Max
Hero Section — Cinématique avec Zoom
Rectangle pleine largeur, hauteur 85–90vh. Fond : votre meilleure photo/vidéo de résultat final en background, avec un zoom lent Ken Burns (5% en 12s) pour un effet premium cinématique. Overlay gradient sombre gauche → centre pour la lisibilité du texte. Gauche : badge "25 Avis Google ⭐⭐⭐⭐⭐", headline accrocheur 3–4 mots max (ex : "Votre Véhicule, Sublimé."), sous-titre 1 ligne, puis bouton CTA principal doré "Demander un Devis" + bouton ghost "Voir nos réalisations". Tout dans un conteneur borderless mais avec padding structuré. Le tout donne une esthétique de marque premium de niveau international.
Média
Photo ou vidéo résultat final. Slow zoom animé CSS.
Objectif
Capturer l'attention + premier clic vers le devis.
Conversion
CTA Devis + CTA Galerie
Section 02
Social Proof Bar
Bande de Confiance
Bande horizontale fine sous le hero. 4 stats en ligne : 25 Avis Google 5★ | Satisfaction 100% | Traitement Pro Certifié | Basé à Clermont Créans. Séparateurs fins, icônes minimalistes. Ancre immédiate de crédibilité avant les services.
Objectif
Installer la confiance avant de voir les services.
Section 03
Services Aperçu
Nos Prestations
Grille de 7 cartes glassmorphiques (4+3 layout). Chaque carte : icône sur-mesure, nom de la prestation, description 2 lignes, badge "À partir de...", et lien "En savoir plus". Survol : légère élévation avec glow bleu. Les 7 services : Polissage / Lustrage · Traitement Céramique · Débosselage sans Peinture (PDR) · Nettoyage Int/Ext · Rénovation Cuir · Rénovation Optique · Rénovation Chrome.
Objectif
Présenter l'offre complète, rediriger vers page Services.
Section 04
Preuve Visuelle
Avant / Après — Le Slider
Le moment de vérité de la page. Slider interactif drag-to-reveal avec 3–4 transformations réelles. Chaque cas : service effectué, véhicule, note courte. Utilise exclusivement vos propres photos authentiques. En dessous : 3 vignettes before/after secondaires en grille. Cette section vend sans un seul mot de texte publicitaire.
Média requis
Paires avant/après haute résolution de vos vrais clients.
Section 05
Process
Comment ça Fonctionne — 4 Étapes
Timeline horizontale avec 4 étapes numérotées en chiffres romains : I · Prise de Contact (formulaire ou appel) → II · Diagnostic Véhicule (inspection et devis personnalisé) → III · Traitement Expert (intervention avec vos produits pro) → IV · Livraison (photos du résultat, garantie du travail). Connectées par une ligne bleue animée au scroll.
Objectif
Éliminer les objections, rassurer sur le déroulement.
Section 06
Cinéma Authentique
Vitrine Vidéo — Vos Vrais Résultats
Section fond sombre avec une vidéo hero en autoplay silencieux (votre meilleur clip slow-motion résultat). À côté ou en dessous : 2–3 vignettes vidéo cliquables (résultats esthétiques, travail en action, finition céramique). Grille asymétrique : 1 grande vidéo + 2 petites. Aucune vidéo stock — exclusivement votre footage. Overlay dark avec léger grain cinématique.
Média requis
Vidéos résultats, slow-mo, travail en action.
Section 07
Avis Vérifiés
25 Avis Google ⭐ — Carrousel de Confiance
Headline centré : "25 Clients Satisfaits. 25 Étoiles." Sous-titre avec lien vers Google. Carrousel auto-scroll de cartes d'avis : nom, étoiles dorées, texte de l'avis, date. Badge Google 4.9★ flottant en haut à droite. Nombre pair d'avis visibles selon la largeur (3 desktop, 1 mobile). Les avis authentiques valent 10× le meilleur copywriting.
Data source
25 vrais avis Google à copier/intégrer.
Section 08
Authenticité
L'Expert Derrière la Marque
Layout 50/50 : gauche = photo authentique de lui en plein travail (polissage, application céramique, concentration totale). Droite = 3–4 phrases courtes et directes sur sa passion, sa formation, son standard d'exigence. 2–3 badges de certifications ou outils pro utilisés. Lien "En savoir plus" vers page À Propos. L'humain vend autant que la technique dans un marché local.
Média requis
Photos de lui travaillant sur une voiture.
Section 09
CTA Final
Priorité Max
Bannière de Conversion Finale
Section pleine largeur fond deep navy avec glow doré ambiant. Headline centré court et percutant : "Votre Véhicule Mérite le Meilleur." Sous-titre : "Devis gratuit · Réponse sous 24h." Deux boutons côte à côte : Demander un Devis (gold, primary) + Nous Appeler (ghost, numéro direct). Étoiles Google en mini-badge. Dernier point de contact avant le footer.
Objectif
Capturer chaque visiteur encore hésitant.
Autres Pages — Détail du Contenu
Page Services
7 Services Détaillés
Hero court — Titre "Nos Prestations" + sous-titre confiance + photo de travail.
Bloc par service — Alternance image/texte (zig-zag). Photo authentique, description technique, bénéfices, badge "À partir de...".
7 services couverts — Polissage, Céramique, PDR, Nettoyage, Cuir, Optique, Chrome.
Bouton Devis par service — Chaque bloc se termine par un CTA personnalisé au service.
FAQ courte — 4–5 questions fréquentes en bas de page (accordéon).
Page Réalisations
Galerie Authentique
Filtres par service — Tous | Polissage | Céramique | PDR | Nettoyage | etc.
Sliders before/after — Grille masonry de paires avant/après avec slider draggable.
Section vidéo — Grille de vos vidéos slow-mo et résultats esthétiques en autoplay silencieux.
Légendes — Chaque réalisation : modèle du véhicule + service effectué.
CTA flottant — "Vous voulez ce résultat ?" → Demander un Devis.
Page À Propos
L'Histoire Authentique
Portrait professionnel — Grande photo de lui en action, éclairage cinématique.
Histoire courte — Passion pour les voitures, pourquoi ce métier, son standard d'exigence.
Valeurs — 3 piliers (Précision / Authenticité / Résultat) chacun avec icône et 2 lignes.
Équipements & Produits — Logos ou noms des marques pro utilisées (IGL, Gtechniq, etc.).
Localisation — Google Maps embed + adresse + zone d'intervention.
Page Devis
Formulaire de Conversion
Champs clés — Prénom / Nom, Email, Téléphone, Modèle du véhicule, Service souhaité (select), Message libre.
Upload photos — Option d'envoyer des photos du véhicule pour un devis plus précis.
Aucun prix affiché — Message clair "Chaque véhicule est unique — devis gratuit sous 24h".
Côté droit — Rappel des avis Google, numéro direct, adresse, heures.
Confirmation — Message de succès personnalisé après envoi.
Stratégie Média & Contenu
Photos Requises
Hero background — Votre meilleure photo ou frame vidéo d'un résultat final (voiture entière, éclairage cinématique).
Paires Avant/Après ×3–5 — Même angle, même lumière, différents services.
En action ×3–5 — Polisseur, application céramique, détail, concentration.
Macro détails ×3 — Goutte d'eau sur céramique, reflet poli, texture cuir rénové.
Portrait — 1 photo de lui en plein travail, bien éclairée, pour la section À Propos.
Vidéos Requises
Vidéo hero — Clip slow-motion 15–30s du résultat final. Meilleure qualité possible. Autoplay silencieux.
Résultats esthétiques ×2 — Walk-around d'une voiture traitée, lumière dramatique.
Process en action ×1–2 — Polissage, application céramique, transformation.
Format — MP4 optimisé web. Clips courts (10–45s) pour chargement rapide.
Textes & Copywriting
Headline hero — 3–4 mots max, impact immédiat. Ex : "Votre Véhicule, Sublimé." / "L'Excellence du Détail."
Langue — 100% Français. Ton direct, technique, jamais promotionnel vulgaire.
Prix — jamais directs — Toujours "À partir de..." sur chaque service, jamais de tarif fixe affiché.
25 avis Google — Copier les textes des avis réels pour la section témoignages.
SEO local — Inclure naturellement "Clermont Créans", "Sarthe", "détailing auto 72" dans les textes.