marka sistemi · v0.1

Marka & Tasarım Sistemi

VonaHub'ın görsel kimliğini oluşturan tüm token'lar — yüzeyler, tipografi, renk paleti, butonlar ve sahne aksentleri. Her parça bu sayfadaki kullanımıyla 1:1 eşleşir.

Logo & İşaret

Wordmark + standalone mark

VonaHub

Yüzeyler

canvas → surface → elevated katmanı

canvas#05060A

Page background

surface#0B0F1A

Section panels

elevated#11172A

Cards · floating

linergb(120 160 255 / 0.08)

Hairline borders

Metin Renkleri

ink, mute, faint

Aa Bb 0123

ink#E8ECF5

Primary text

Aa Bb 0123

mute#8590B0

Secondary

Aa Bb 0123

faint#4F5872

Tertiary · meta

Neon Aksent Paleti

5 sinyal rengi

laser#00E5FF

Primary neon · CTA

electric#2A6BFF

Vevona DNA · brand

plasma#7C5CFF

Depth · gradient

signal#FF3DCB

Critical · alert

glow#B8FF3D

Live indicator

Sahne Aksentleri

6 modül · pipeline'da kullanılır

İçerik üret

create#00E5FF

Planla

plan#7C5CFF

Yayınla

publish#2A6BFF

Chatbot

chatbot#B8FF3D

Reklam yönet

ads#FFB020

Raporla

report#FF3DCB

Tipografi

Bricolage display · Plus Jakarta · JetBrains

display-headline · 56/0.95Bricolage Grotesque · 600

Hareket ve sezgi.

display-headline · 28/1.2Bricolage Grotesque · 600

Başlık örneği · h2

body · 16/24Plus Jakarta Sans · 400

Body — açıklama metni. Ürünün ne yaptığını sade ve doğrudan anlatır. 16/24 punto, mute renk.

data-label · 11/0.18emJetBrains Mono · uppercase

data-label · meta

num-display · tnumBricolage · tabular nums

2.4M

Butonlar

primary · outline · ghost

primary

outline

ghost

Kartlar

surface · elevated · glow border

surface

Standart kart yüzeyi

Pricing, FAQ, modül listeleri. Hairline border +.

elevated

Yükseltilmiş kart

Form alanları, drawer içerikleri, pricing add-on bloğu.

glow-border

Conic gradient çerçeve

"Popular" plan, vurgu kartları. Sürekli dönen conic light line.

Rozetler & Pill'ler

durum, canlı, sayaç

liveauto ✓human →yakındabetapopüler★ winnergönderildi

Gradyanlar

flow, aurora, conic glow

.gradient-flowlaser → electric → plasma

.gradient-auroraradial · top

VonaHub

.text-gradient-flowlinear 120°

Işıma & Halo

ring-glow, glow-laser, glow-signal

.ring-glow

subtle accent

.glow-laser

laser halo

.glow-electric

electric halo

.glow-signal

signal halo

Easing & Hareket

cubic-bezier preset'leri

--ease-out-expo

cubic-bezier(0.22, 1, 0.36, 1)

Yumuşak çıkış · panel/kart girişleri

--ease-in-out-quint

cubic-bezier(0.83, 0, 0.17, 1)

Simetrik · sahne geçişleri

--ease-spring

cubic-bezier(0.34, 1.56, 0.64, 1)

Esnek · pop-in mikro etkileşim