Kliva Brand Guidelines

Brändi, joka perustuu selkeyteen, dataan ja pohjoismaiseen rauhallisuuteen

Alla olevat ohjeet kuvaavat, miltä Kliva näyttää, kuulostaa ja tuntuu – logosta ja väripaletista typografiaan, äänensävyyn ja komponenttikieleen. Niiden avulla varmistat, että kaikki pinnat ovat johdonmukaisia, rauhallisia ja luotettavia.

Sisältö

Löydä oikea – nopeasti

Siirry suoraan tarvitsemaasi osioon: arvot, visio, tunnuslause, logo, väri, typografia, ääni tai komponenttikieli.

01ArvotKolme arvoa, jotka ohjaavat kaikkea toimintaamme.02Visio & missioMaailma, jonka haluamme nähdä – ja mitä teemme joka päivä.03TunnuslauseKaikki yhdessä paikassa – lyhyt ja pitkä versio.04LogoOrdbild, ikon och nedladdningar (SVG).05VäripalettiCream, accent orange, Kliva green ja tokenit.06TypografiaAptos Serif, Plus Jakarta Sans, Inter.07Äänensävy & puhetapaMiten kirjoitamme – konkreettisesti, rauhallisesti, lähteisiin perustuen.08Sosiaalinen mediaLinkedIn-mallit, kuvakkeet ja bannerit.09Hero & pistekarttaHero-resepti ja pistekartta-kuvitus.10SuunnitteluperiaatteetVälit, kortit, painikkeet ja komponenttikieli.

Arvot

Kolme arvoa, jotka ohjaavat kaikkea toimintaamme

Ennen väriä, typografiaa ja logoa tulevat arvot. Ne määrittävät, miten kirjoitamme, mitä lupaamme ja miten kohtaamme asiakkaat ja kollegat. Jos jokin tuntuu väärältä – palaa näihin kolmeen.

Läpinäkyvyys

Näytämme lähteet, menetelmät ja epävarmuuden – aina.

Näytä datalähde ja päivityspäivä jokaisen luvun vieressä
Kerro, mitä emme tiedä, älä vain sitä, mitä tiedämme
Selkeä hinnoittelu, ei piilotettuja ehtoja

Uteliaisuus

Kysymme uudelleen, ennen kuin rakennamme vastauksen.

Kysy 'miksi', ennen kuin ehdotamme 'miten'
Testaa oletukset todellisella tiedolla, ei mutu-tuntumalla
Palkitse uudet kysymykset yhtä lailla kuin uudet vastaukset

Nöyryys

Tiedämme, että kiinteistöala osaa työnsä meitä paremmin.

Kuuntele ennen kuin selitämme
Myönnä virheet ajoissa ja selkeästi
Ei superlatiiveja itsestämme — anna työn puhua puolestaan

Arvotesti

Ennen kuin mitään julkaistaan – sivu, sähköposti, esitys, julkaisu – sen on läpäistävä kolme kysymystä:Onko se totta? Onko se uteliasta? Onko se nöyrää?

Visio & missio

Pohjoismainen kiinteistömarkkina, jota ohjaa jaettu, läpinäkyvä data

Visio ja missio ovat kaksi kiintopistettä, jotka ohjaavat kaikkea rakentamaamme. Visio kuvaa maailmaa, jonka haluamme nähdä. Missio kuvaa, mitä teemme joka päivä saavuttaaksemme sen. Kun tekoäly nyt kirjoittaa, tiivistää ja ehdottaa päätöksiä alalle, on tärkeämpää kuin koskaan, että pohjan lähde on oikea, laadukas, ajantasainen ja jalostettu – muuten virheet skaalautuvat oivallusten sijaan.

Visio

Pohjoismainen kiinteistömarkkina, jossa päätökset perustuvat faktoihin, eivät arvauksiin – jossa data, lähteet ja menetelmät ovat jaettuja, tarkasteltavissa ja riittävän turvallisia, jotta tekoäly voi rakentaa niiden varaan.

Missio

Kerää kaikki kiinteistödata, kaikki työkalut ja koko työnkulku yhteen paikkaan – varmista, että tiedot ovat oikeita, laadukkaita, ajantasaisia ja jalostettuja, jotta ihmiset ja tekoäly voivat yhdessä saavuttaa uusia oivalluksia ja tehdä parempia päätöksiä.

Tämä tarkoittaa käytännössä

Yksi alusta — ei enempää siiloja, ei enempää vientiä
Lähteet ja päivityspäivät jokaisen luvun vieressä
Jalostettu data ja valmiit analyysit, ei vain raakavientiä
Tekoälyvalmis: jäljitettävissä, tarkastettavissa ja versioitu
Avoimet integraatiot alan jo käyttämiin järjestelmiin
Yhtä hyödyllinen analyytikolle, omaisuudenhoitajalle ja hallitukselle

Tunnuslause

Kaikki yhdessä paikassa

Panostamme vanhaan klassikkoon. Se on ollut olemassa pitkään – ja pitää paikkansa nyt enemmän kuin koskaan. Yksi alusta, kaikki data, kaikki työkalut, koko kiinteistön elinkaari.

Lyhyt

Kaikki yhdessä paikassa

Pitkä

Kaikki yhdessä paikassa – kiinteistöalan alusta —

Käytä lyhyttä versiota logo-lockupeissa, sosiaalisen median biosissa ja pienissä tiloissa. Pitkää versiota heroissa, pitchdeckeissä ja lehdistömateriaalissa, jossa konteksti on tarpeen.

Logo

Yksi sanakuvake – kaksi vaihtoehtoa

Kliva-logotypen finns som full ordbild och som komprimerad ikon. Den orange pricken är obligatorisk och får aldrig flyttas, byta färg eller tas bort. Använd ordbilden i headers, dokument och pressmaterial; ikonen i favicon, app-tiles och små ytor.

Sanakuva

Cream – ensisijainen

Oletus sanakuva verkkoon, dokumentteihin ja lehdistömateriaaliin.

Lataa SVG →

Tumma – invertoitu

Tummissa pinnoissa ja yötilassa. Sanakuva cream-värillä, piste oranssilla.

Lataa SVG →

Valkoinen – tarvittaessa

Endast när cream-bakgrunden inte är möjlig (tredjepartsplattformar).

Ikon

Cream – ensisijainen

Oletus app-kuvake, favicon, sosiaalisen median avatarit.

Lataa SVG →

Tumma – invertoitu

Tummissa pinnoissa ja yötilassa. K cream-värillä, piste oranssilla.

Lataa SVG →

Valkoinen – tarvittaessa

Endast när cream-bakgrunden inte är möjlig (c.ex. tredjepartsplattformar).

Piste (brand mark)

Hieman pyöristetty neliö – ei koskaan ympyrä

Klivan tunnusomainen piste on squircle (pyöristetty suorakulmio, noin 20 % säteellä) – ei ympyrä. Sitä on kolmessa hyväksytyssä värissä: oranssi vaalealle taustalle, valkoinen tummalle taustalle ja Cream Deep pehmeille vaaleille pinnoille, joissa oranssi olisi liian kirkas. Sivun pituus vastaa viereisen typografian x-korkeutta.

Oranssi

Vaalealle taustalle

Valkoinen

Tumman taustan päälle

Cream Deep

Pehmeät vaaleat pinnat

Suoja-alue

Lämna minst en K-höjd luft runt logotypen i alla riktningar.

Taustat

Mörk logotyp på ljusa ytor. Inverterad på #161A1F eller mörkare. Aldrig på lågkontrast-bilder.

Ei sallittu

Inte rotera, sträcka, lägga skugga, byta färg på K eller ta bort den orange pricken.

Väripaletti

Rauhallinen pohja, lämpimät korostukset

Värimaailma perustuu lämpimään kermaan (Primary) ja lähes mustaan tekstiin. Korostusoranssia käytetään säästeliäästi otsikoissa, hiiren osoittimen viipyessä ja ikonisessa pisteessä. Kliva Green on toissijainen brändivärimme datavisualisointiin ja positiivisiin tiloihin.

Ydinpaletti

Foreground

Primär text, rubriker, mörka knappar

token --foreground

hsl 220 14% 10%

hex #161A1F

Primary (Cream)

Hero-bakgrund, lugna ytor

token --primary

hsl 47 24% 92%

hex #EFEBDF

Background

Default sidbakgrund

token --background

hsl 0 0% 100%

hex #FFFFFF

Background tertiary

Funktionsöversiktsektioner

token --background-tertiary

hsl 0 0% 100%

hex #FFFFFF

Secondary

Subtila kort, ikonbakgrunder

token --secondary

hsl 220 6% 95%

hex #F1F2F3

Muted foreground

Brödtext, beskrivningar

token --muted-foreground

hsl 220 6% 38%

hex #5C6068

Border

Tunna avgränsare, kort-kanter

token --border

hsl 220 6% 88%

hex #DEE0E2

Cream Deep

Mörkare cream — pricken på ljus bakgrund, hover på primary, dividers

token --cream-deep

hsl 45 22% 78%

hex #D6CFB6

Korostukset & pinnat

Accent Orange

Eyebrows, prick i logotyp, CTA-detaljer

token --accent-orange

hsl 27 96% 61%

hex #FB923C

Kliva Green

Brand-accent, framgångstillstånd

token --kliva-green

hsl 172 56% 36%

hex #299184

Surface Sky

Datavisualisering, lugna kort

token --surface-sky

hsl 210 55% 93%

hex #DCE8F4

Typografia

Serif tunteeseen, sans selkeyteen

Klivan typografia yhdistää Aptos Serifiä suuriin otsikoihin (lämmin, redaktionaalinen sävy) Plus Jakarta Sansin alaotsikoihin ja käyttöliittymään, sekä Interin leipätekstiin. Versaliväli -0.025em otsikoissa, normaali leipätekstissä.

H1 — Aptos Serif · 300 · -0.01em

Kiinteistöalan työnkulku

H2 — Plus Jakarta Sans · 500 · -0.025em

Yksi alusta — kaikki tarvitsemasi työkalut

H3 — Plus Jakarta Sans · 300

Toiminnallisuuskatsaus ja datavarasto

Leipäteksti — Inter · 400 · 1.6 rivinväli

Projektista transaktioon ja complianceen. Kliva kokoaa päätöksentekoon tarvittavan tiedon portfolioista ja projekteista minuuteissa — ei päivissä. Sinulle, joka kehität, hallinnoit, sijoitat tai analysoit rakennettua ympäristöä.

Eyebrow — Inter · 600 · 0.05em isoilla kirjaimilla

Toiminnallisuuskatsaus

Äänensävy & puhetapa

Konkreettinen, rauhallinen, ei koskaan hypetty

Kliva puhuu kuin kokenut analyytikko, joka selittää jotain monimutkaista vesilasin ääressä — ei kuin myyjä. Lyhyitä lauseita. Konkreettisia lukuja. Ei koskaan superlatiiveja ilman sisältöä.

Sano näin

t("brandPage.beslutsunderlagPaMinuterInte")
t("brandPage.24mFastigheter290Kommuner")
t("brandPage.filtreraPaTypkodLageYieldOch")
t("brandPage.nordiskDataSvenskaServrar")

Vältä

t("brandPage.revolutionerandeAiDrivenProptech")
t("brandPage.gameChanging"), "next-gen", "world-class"
Utropstecken. Versaler för betoning.
t("brandPage.sverigesEnda") — vi är nordiska, inte svenska.

Selkeä

En mening, en idé. Förklara aldrig en funktion innan du sagt vad den ger.

Konkreettinen

Använd siffror, källor, tidsåtgång. "Snabbare" är inte en egenskap.

Rauhallinen

Vi övertygar genom precision, inte genom volym. Ingen FOMO, inga emojis.

Hero-osiot & dotmap-konsepti

Kermapohja, sanahahmo vasemmalla, piste-kuvitus oikealla

Dotmap är vårt föredragna illustrationsspråk — motiv byggda av små prickar i gråa nyanser för formen och orange nyanser för accent och fokus. Den nordiska kartan är en variant; varje hero kan ha sin egen (megafon för marknad, byggnader för fastigheter, nätverk för data). Receptet är detsamma: varm cremebakgrund (Primary), rubrik i Aptos Serif vänsterställd i max 17ch, dot-illustration som lugn visuell ankare till höger — aldrig över 55% bredd eller 55% opacitet.

Eyebrow

Otsikko Aptos Serifissä, enintään 17 merkkiä per rivi

Leipäteksti Interissä, max-w-md, rauhallinen sävy. Kaksi CTA:ta: yksi tumma ensisijainen ja yksi ääriviiva.

Tausta

Aina bg-primary (cream #EFEBDF). Aldrig vit eller mörk i hero.

Piste-paletti

Muoto harmaana (hsl(0 0% 38–66%)), accent och fokus i orange (hsl 22 92% 50–62%). Inga andra färger.

Sijainti

Oikea sivu, max 55% leveys, peittävyys 0.55, pointer-events-none, alt="" aria-hidden="true" (dekorativ).

Korkeus

Sivun yläbanneri etusivulla: 80dvh. Alasivun yläbanneri: pt-32 md:pt-44 + pb-20 md:pb-28.

Ote

<section className="relative bg-primary overflow-hidden pt-32 md:pt-44 pb-20 md:pb-28">
  <div className="content-grid relative">
    <div className="max-w-3xl">
      <p className="text-sm font-semibold text-accent-orange uppercase tracking-wider">{t("brandPage.eyebrow")}</p>
      <h1 className="font-display font-normal text-4xl md:text-6xl max-w-[17ch]">…</h1>
    </div>
    <div aria-hidden className="absolute right-0 top-0 h-full w-[55%] opacity-55 pointer-events-none">
      <img src={heroDotmap} alt="" aria-hidden="true" />
    </div>
  </div>
</section>

Suunnitteluperiaatteet

Bento, lämmin pohja, yksiväriset ikonit

Asettelu perustuu lämpimään cremetaustaan ja bento-ruudukkoon, jossa tummat kortit korostavat ensisijaisia ominaisuuksia ja vaaleat kortit kantavat toissijaisia. Ikonit ovat aina yksivärisiä – ei koskaan pastelliväristä taustapahvia.

Tumma kortti

Yläbannerin ominaisuus

Mörka kort används för hero-features (Kliva Pipeline, AI & MCP). Gradient från #161A1F till #2A2418 ger varm djup utan att bli flat svart.

Vaalea kortti

Toissijainen ominaisuus

Ljusa kort bär sekundär information med tunn border.

Säde

Globalt subtil radius (2px) på stora ytor. Knappar och inputs behåller sin standardradius.

Väli

section-padding: 6rem vertikalt på desktop. content-grid max-w 1580px.

Kohdistus

translate-y-1 + soft shadow. Aldrig färgskifte på hela ytan.

Brändi, joka perustuu selkeyteen, dataan ja pohjoismaiseen rauhallisuuteen

Löydä oikea – nopeasti

Kolme arvoa, jotka ohjaavat kaikkea toimintaamme

Läpinäkyvyys

Uteliaisuus

Nöyryys

Pohjoismainen kiinteistömarkkina, jota ohjaa jaettu, läpinäkyvä data

Kaikki yhdessä paikassa

Yksi sanakuvake – kaksi vaihtoehtoa

Hieman pyöristetty neliö – ei koskaan ympyrä

Rauhallinen pohja, lämpimät korostukset

Serif tunteeseen, sans selkeyteen

Yksi alusta — kaikki tarvitsemasi työkalut

Toiminnallisuuskatsaus ja datavarasto

Konkreettinen, rauhallinen, ei koskaan hypetty

LinkedIn — yritys ja henkilökohtainen

Kermapohja, sanahahmo vasemmalla, piste-kuvitus oikealla

Otsikko Aptos Serifissä, enintään 17 merkkiä per rivi

Bento, lämmin pohja, yksiväriset ikonit

Yläbannerin ominaisuus

Toissijainen ominaisuus