Huisstijlgids
Het OVOKY-logo, de iconen, kleuren en letters, en hoe je ze gebruikt. Elke waarde op deze pagina is vast en identiek aan wat de website zelf gebruikt.
Logo
Drie kleurvarianten
Het woordmerk bestaat uit vijf geometrische tekens. Laat aan elke kant een vrije ruimte van 0,4 × de logohoogte, en toon het nooit smaller dan 72 px.
Vrije ruimte
Het gearceerde vierkant is 0,4 × de logohoogte.
Niet doen
- Het woordmerk inkleuren buiten de drie kleurvarianten
- Het sky-logo op witte of lichte achtergronden plaatsen
- Schaduwen, contouren of verlopen aan het woordmerk toevoegen
- Het logo uitrekken, draaien of in een lettertype namaken
App-icoon
Het beeldmerk op een verloop
Alleen het eerste teken, gecentreerd op een derde van de icoonbreedte, op een verticaal verloop met twee kleuren. Blauw is de standaard.
Kleur
Twee gespiegelde families
Blauw en groen lopen elk van een bleke tint tot een diepe schakering. Neutrale kleuren zijn naar navy getint. Sky en mint zijn alleen voor donkere achtergronden.
Roze & pruim (merk)
- #050003
Night
Hero, footer, 3D-scène
- #1F0D25
Plum
Donkere banden en kaarten
- #911D6E
Ribbon
Linten, diepe roze vlakken
- #FF488B
Pink
Primaire knoppen, accenten op donker
- #D6176A
Berry
Links, cijfers, roze tekst op licht
- #FF9EC9
Glow
Roze tekst op donker
- #FBE4EE
Blush
Chips, badges, rustige knoppen
Neutraal (pruimgetint)
- #1C0D22
Ink
Lopende tekst, volle knoppen
- #6A5870
Muted
Secundaire tekst
- #E6D8E3
Line
Randen
- #F9F2F6
Paper 2
Achtergrond van secties
- #FDFBFC
Paper
Paginaachtergrond
Blauw (product, ondersteunend)
- #CCEEFF
Ice
Productmock-ups
- #33BBFF
Sky
Hoofdkleurvariant van het logo
- #006699
Ocean
Productmock-ups
- #004466
Navy
Productmock-ups
Groen (product, ondersteunend)
- #CCFFEE
Foam
Productmock-ups
- #33FFBB
Mint
Status in mock-ups
- #009966
Emerald
Status in mock-ups
Diepblauw
#006699 → #004466
Diepgroen
#009966 → #006644
Wash
Achtergronden van hero en uitlichtingen
Accent in titels
Ocean → emerald op licht
Typografie
Google Sans
Google Sans voor titels en tekst, Google Sans Code voor labels. Titels in vet met een krappe letterafstand, en altijd met alleen een hoofdletter aan het begin.
Display · Google Sans Bold
Meer bellen, minder spamlabels
Sectietitel · display-2
Beantwoord elke oproep zoals het hoort
Lopende tekst · Google Sans Regular 17 px
De contactfiche staat al open voor de klant hallo zegt. Notities, terugbelafspraken, e-mails en sms'en komen allemaal op dezelfde tijdlijn.
Label · Google Sans Code SemiBold, hoofdletters
Predictive dialer · Live · 32 rapporten
Interface
Knoppen en labels
Primaire acties in navy, accentacties in mint met ink-tekst, secundaire acties met een omlijning. Eén primaire knop per scherm.
- Ink op paper voor lopende tekst; ocean voor links (6,2:1)
- Emerald voor iconen en grote tekst; forest voor kleine groene tekst
- Sky en mint alleen op navy of ink
Iets anders nodig voor pers of partners?
Stuur ons een bericht, dan bezorgen we je de bestanden of richtlijnen die je nodig hebt.