Wise
Syvää sammalta ja kalkkikiven jännitystä. Kalkkikivi kimaltelee lähes mustalla metsänpohjalla, ja massiiviset, kulmikkaat hahmot viestivät jokaisesta liikkeestä.
Wise-kirjasintyyppi puhuu itsevarmalla, hieman kovalla äänellä: syvän metsänvihreä (#163300) peittää suurimman osan pinta-alasta – teksti, navigointi, tummat osiot, kuvakkeet – kun taas yksi kirkas limenvihreä (#9fe870) toimii toiminnallisena välimerkkinä toimintakehotuksissa, aktiivisissa välilehdissä ja keskeisissä elementeissä. Kirjasintyyppi on lähes aggressiivinen: Wise Sans, jonka rivin paksuus on 900 ja joka on tiheästi pakattu, erottuu suurilla kirjaimilla (yli 100 pikseliä) aloitusnäytöllä. Loput järjestelmästä pysyvät huomaamattomina luonnonvalkoisella pohjalla, jossa on pehmeän harmaat pinnat (#e8ebe6). Komponentit – painikkeet, navigointisegmentit, valintaruutujen pikkukuvat, kuvamaskit – ovat oletusarvoisesti pillerinmuotoisia, ja pienet säteet (10 pikseliä) on varattu korteille ja syöttökentille. Värigradientit ovat harvinaisia; sen sijaan salamanterin ja metsänvihreän yhdistelmä muuttuu sujuvasti osioiden tummuessa luoden rytmin ilman liiallista koristelua.
Keskitetty säilö, jonka enimmäisleveys on 1200 pikseliä ja jonka ylä- ja tumma osa ulottuvat koko sivun leveydelle. Ylätunnisteessa on massiivinen, keskitetty otsikko valkoisella taustalla ja suuri kuva (maapallo), joka ulottuu näyttöalueen alareunan ulkopuolelle. Osioiden rytmi vaihtelee valkoisen, vaaleanvihreän ja tumman "metsämusteella" sävytetyn osion välillä, mikä luo luonnollisen värirytmin. Sisällön asettelu on pääasiassa keskitetty: teksti- ja kuvalohkot kahdessa sarakkeessa yläosassa tai rivit, joissa on ensisijaisia elementtejä kolmessa sarakkeessa toissijaisissa osioissa. Maaluettelo näytetään viisisarakkeisessa ruudukossa, jossa on lippuja. Navigointi koostuu yhdestä kiinteästä yläpalkista, jossa on segmentoitu kytkin. QR-koodi pysyy kiinteänä oikeassa alakulmassa kaikissa vierityskohdissa.
Brändin visuaalisen maailman luovat 3D-kuvitukset, jotka esittävät maapalloa ja kultakolikoita – kosketeltavia, hieman surrealistisia, pehmeillä liukuväreillä ja lämpimällä valaistuksella toteutettuja. Valokuvaus on minimalistista; käytettynä se on selkeää ja rentoa. Kansallisliput esitetään pyöreinä pikkukuvina viisisarakkeisessa ruudukossa – ainoa "ikoninen" järjestelmä on kansallinen identiteetti. Ei abstrakteja graafisia elementtejä, ei vakiomalleja. Maapallo ja kolikot ovat maskotin toistuva teema, joka viestii globaalista ulottuvuudesta yhden, lämpimän ja optimistisen esineen kautta pikemminkin kuin montaasin kautta.
Paletti
Merkki
- Forest Ink
#163300— Brändin vallitseva tumma tyyli – navigointiteksti, tummat osioiden taustat, leipäteksti vaaleilla pinnoilla, kuvakkeiden ääriviivat ja täytetyt navigointielementit – määrittelee sen vahvuuden: aina kun tarvitaan painoa tai auktoriteettia, valitset Forest Inkin. - Lime Voltage
#9fe870— Vihreää käytetään toissijaisena aksenttina koristeellisissa yksityiskohdissa ja korostamaan harvemmin käytettyjä hakulausekkeita. Sitä ei tule käyttää ensisijaisena värinä toimintakehotuksissa. - Spruce
#054d28— Toissijaista tummanvihreää käytetään korttien pinnoilla, pienissä ikonografioissa ja lisäämään syvyyttä tummille alueille, joilla Forest Ink on liian kylläinen.
Neutraali
- Linen Mist
#e2f6d5— Vaaleanvihreä sävy pehmeisiin korostuksiin pinnoilla, sävytettyihin korttien taustoihin ja navigointipalkkien osoittimen alla oleviin tiloihin. Hienovarainen, tunnusomainen vihreä sävy hillityille säiliöiden suunnitteluelementeille. - Signal Blue
#0b4c72— Sininen väri toimii lisäaksenttina koristeellisille yksityiskohdille ja korostaa matalia taajuuksia. - Alarm Red
#cb272f— Punainen toimii koristeellisten yksityiskohtien ja epätavallisten värien korostajana. Käytä sitä tukevana aksenttina, älä statusvärinä. - Charcoal
#454745— Leipäteksti, leipäteksti, rikas käyttöliittymä – hieman lämmin musta, joka tuntuu pehmeämmältä kuin pelkkä #000 valkoisella taustalla. - Obsidian
#0e0f0c— Otsikot, korkeakontrastiset otsikot, puhtaan mustat elementit navigoinnissa ja päävalikossa. Mustaa hieman vihertävällä sävyllä, ei neutraalin harmaata. - Pebble
#868685— Hiljaista toissijaista tekstiä, paikkamerkkitekstiä, kuvakkeiden ääriviivoja ja syöttökenttien reunoja. Keskiharmaa, katoaa kauas.
Typografia
12:sta 105 pikseliin · 10 askelta
- Inter — korvaava: Inter (native Google Fonts) · ääriviivat 400,500,600,700 · Leipäteksti, käyttöliittymä, kuvatekstit ja alaotsikot koko tuotteessa. Keskitason otsikoissa (36–45 pikseliä) käytetään fonttikokoa 700, alaotsikoissa ja kuvateksteissä 500–600 ja leipätekstissä ja kuvateksteissä 400. Inter antaa hienovaraisemman ilmeen, kun taas Wise Sans tarjoaa rohkeamman ilmeen.
- Wise Sans — korvaava: Inter Black (900) with -0.04em tracking · ääriviivat 900 · Otsikot ovat brändin käyntikortti. Erittäin tiheä 900-fontti, jonka väli on 89–105 pikseliä ja kirjainväli on pieni, muuttaa jokaisen otsikon lihavoiduksi mainokseksi. Niitä käytetään säästeliäästi: leipätekstissä, osioiden otsikoissa ja kampanjoiden kohokohdissa.
- monospace — korvaava: Inter · ääriviivat 400 · monospaced - löytyy poimitusta datasta, mutta tekoäly ei ole kuvannut sitä.
Intervallit ja muoto
| Tarkoitus | Merkitys |
|---|---|
| Tiheys | tiheä |
| Perusvaihe | 8-12px |
| Painikkeen säde | 9999px |
| Kortin säde | 10px |
| Varjot | ei - reunoja varjojen sijaan |
| Osioiden välillä | 64-80px |
| Sivun leveys | 1200px |
Tekoäly rakentaa verkkosivustosi Wise -tyyliin ja täyttää sen
- Täytä tuotteilla ja julkaisuilla linkin kautta - Instagram, TikTok, Facebook.
- Siirrä sisältöä vanhalta sivustoltasi – määritä vain osoite.
- Moderni design parhaalla hakukonemoottorilla: React ( Next.js) palvelinrenderöinnillä ja SEO-optimoinnilla suoraan paketista.
- Täysin automatisoitu hakukoneoptimointi hakutuloksille ja neuroverkkosuosituksille.
Samankaltaisia tyylejä
- Integrated Biosciences — bioluminesenssilaboratorio keskiyöllä
- Huly — Revontulet Keskiyön observatoriolla - päähenkilö on pystysuora violetti säde, joka haalistuu koralliksi, ja jokainen sen alla oleva hiljainen osa lainaa samaa kaksisävyistä tarinaa, joka kerrotaan hillitymmällä sävyllä.
- Dia Browser — Pimiögalleria sulautuu toimitukselliseen sanomalehteen. Pikimusta kohtaus paljastaa auringonvalon valaiseman sanomalehtiaukeaman, jonka jokaisessa osiossa on yksi serif-otsikko.
- Mintlify — Pilvipuutarha lasipöydän yläpuolella. Käsin piirretty taivas ja dokumenttielokuva on rajattu yhteen – ainoa paikka, jossa väri ja käsite törmäävät ennen kuin sivu haalistuu luostarinvalkoiseksi.
- Gleap — Lämpimin kermanvärisin ja grafiittiaksentein koristeltu työtila – studio, jossa mattamustat mustepisteet näyttävät leijuvan pellavaisen arkkitehtuurin yllä.
- ClickUp — Tehokas kojelauta valkoisella marmorilla. Sivu on tuottavuustyökalun tuote-esite, joten visuaalinen kieli on lainattu tuotteesta itsestään: tiheät luettelot, tilaindikaattorit, avatar-ryhmät ja lihavoidut typografiset lausunnot, jotka näyttävät näytöllä olevalta tuotespesifikaatiolta.
- monday — Valkoinen työpaja pastelliväreillä
- Portal — Twilight Serif Editorial - Ensiluokkainen aukeama itsenäisessä aikakauslehdessä, suunniteltu iOS-tyyliin
- Slack — Lava on munakoisonvärinen ja siinä on valkoiset kohdevalot. Syvän luumun sävy hallitsee tummia alueita, ja luonnonvalkoinen kangas antaa suurten, avantgardististen nimikkeiden hengittää vapaasti.
- Base44 — Auringonvalossa oleva muistikirja kalkkitussilla
- Letters — Aamuvastaanotto ulkoilmaklinikalla – steriili valkoinen pöytä pehmeän sinisen katon alla, täynnä kirurgisia sinisiä instrumentteja
- Duolingo — Vihreä leikkikenttä paksuilla merkinnöillä