Branding (logo + szín)

Logo-feltöltés, szín-séma testreszabás, CSS-változók, brand-konzisztencia

Branding

A whitelabel-branding a salon vizuális brand-jét hozza Bookinda-szintre. Logók és színek minden felületre.

Logo-feltöltés

A 5 mező

  1. Admin logó (Bookinda-Manager felülete, bal oldalsáv)
  2. Booking page logó (foglalási oldal felül)
  3. Customer Portal logó (vendég-felület)
  4. Email-fejléc logó (kimenő email-ek)
  5. Favicon (böngésző-fül-ikon)

Feltöltés

  1. Whitelabel oldal → branding-szekció
  2. Mező melletti Upload gomb
  3. PNG / JPG / SVG (max 1MB)
  4. Auto-méretezés a felület-méretre

Logo-best-practice

  • Transparent háttér (PNG / SVG)
  • Min 200px szélesség (Retina-display)
  • Max 1MB méret (gyors-betöltés)
  • Brand-konzisztens szín (a szín-sémához illeszkedő)

Szín-séma

Admin theme (Bookinda-Manager)

  • Primary: a fő-akció szín (gombok, link-ek)
  • Primary Light: a primary halványabb (background-ok)
  • Primary Dark: a primary sötétebb (hover-state)
  • Accent: kiegészítő szín
  • Sidebar background: bal oldalsáv

Email theme

  • Header background: az email fejléc-szín
  • Accent: gombok / link-ek színe
  • Footer background: a footer-szín

Booking page

  • Primary: fő-akció szín
  • Accent: kiegészítő
  • Custom background: a teljes oldal-háttér (kép vagy szín)

Portal

  • Primary: a customer portal fő-szín

CSS-változók

A színek CSS custom properties-ként alkalmazódnak:

  • --primary: a fő szín
  • --primary-light: világosabb
  • --primary-dark: sötétebb
  • --accent: kiegészítő
  • --sidebar-bg: oldalsáv-háttér

A teljes Bookinda-felület ezeket használja, így egy szín-csere mindenhol látszik.

Szín-választás-best-practice

Kontraszt

A vendég-felületen olvashatóság kritikus:

  • Primary vs Background: min 4.5:1 kontraszt-arány (WCAG AA)
  • Tesztelés szín-vakos szempontból (Coblis, stb.)

Brand-konzisztencia

A szín-séma matchelje a salon-arculatot:

  • Logo szín → primary szín
  • Hangulat: prémium = sötét + arany, kortárs = pasztell + szürke

Pszichológia

  • Kék: bizalom (orvosi, professzionális)
  • Lila: prémium, kreativitás
  • Zöld: wellness, természetes
  • Piros: energia, sürgősség (vigyázz, agresszív lehet)
  • Arany / sárga: luxus

Real-time preview

A whitelabel-szerkesztőn real-time preview:

  • Egyik oldalon a config
  • Másik oldalon a render-előnézet
  • Élő-frissítés szín-változáskor

A vendég-szempontú teszteléshez nyisd a foglalási oldalt incognito-böngészőben.

Cache-frissítés

A whitelabel-config változás után:

  • A Bookinda-felület azonnal frissül
  • A vendég böngésző-cache-jében a régi színek lehetnek (max 24 óra)
  • A vendégnek hard-reload (Ctrl+Shift+R) elég

Mikor használd

Szcenárió 1, új salon-brand Salon-tulajdonos brand-design-ot készíttet (logó + szín-paletta). Bookinda-ban beállítja, real-time preview-vel finomhangolja.

Szcenárió 2, szezonális branding Karácsonyi piros + zöld. Az alap brand mellé temporary felülírás.

Szcenárió 3, franchise-stílus Franchise-csoport "GlamSalon". Mindegyik franchise tag-nek azonos logó, de helyszín-specifikus prima-szín.

Szcenárió 4, A/B teszt Két különböző primary szín. Vendég-feedback alapján döntés.

Tippek

  • Real-time preview kötelező használat, ne mentse a config-ot anélkül.
  • A logo-méret-arányt tartsd egyenletesen, ne legyen egy felületen óriási, másikon mini.
  • A szín-paletta 5 színből álljon, ne 15. Egyszerűség.
  • A WCAG AA kontraszt-arány a vendég-élmény kritériuma.
  • A cache-frissítés a vendég-felelőssége, te csak figyelmezteted.
  • A SuperAdmin-szintű brand-felülírás (a tenant beállítása felett) ritkán használt, csak agency-modellben.

Kapcsolódó cikkek

#logo#color#css-variables#contrast
💬

Van kérdésed? Kérdezd az AI asszisztenst

A Bookinda AI ismeri az egész tudástárat, és másodperceken belül válaszol.

B

Bookinda AI Asszisztens

Kérdezz bármit a funkciókról, beállításokról, integrációkról.

Szia! Bookinda asszisztens vagyok. Tudok válaszolni funkciókkal, számlázással, integrációkkal kapcsolatos kérdésekre. Miben segíthetek?

Még mindig segítségre van szükséged?

Lépj kapcsolatba az ügyfélszolgálatunkkal.

Kapcsolatfelvétel