ČrniloGlavno platno
#0f1116Referenčno platnoE | T DIGITAL · OBLIKOVNI SISTEM
Jasni sistemi. Sanjske digitalne izkušnje.
Editorialna struktura povezuje temno črnilo, umirjen kolaž in selektivno taktilnost. ARCH // GLITCH CORE ostane ločena projektna tema.
Temelji znamke
E | T Digital je globalna portfolio znamka: profesionalna editorialna osnova, sanjski materialni poudarki in zelo redek signal. UI, besedilo in podatki ostanejo nativni HTML, CSS ali SVG.
- 70–80% platna uporabljata črnilo in mirne neprosojne površine.
- Tekstura je lokalna: na sliki, CRT-ju ali prehodu, nikoli čez bralno jedro.
- Kislo zelena označuje aktivno ali potrjeno stanje in se vedno kombinira z obliko ali oznako.
Barvni sistem E | T Digital
Vzorci in prikazane vrednosti se berejo neposredno iz iste datoteke CSS tokenov, ki poganja vmesnik.
KremaGlavno besedilo in papir
#e6e1d614,48 : 1 na črniluPudrasto modraInformacijski poudarek
#8fa8bf7,66 : 1 na črniluSivkaInterakcija in fokus
#9688ca6,00 : 1 na črniluNežno rožnataEditorialni craft poudarek
#b87a875,55 : 1 na črniluPrašnata vrtnicaDekorativni sekundarni poudarek
#c46a7e5,13 : 1 na črniluMah — osnovniVelike oblike in dekoracija
#657a403,97 : 1 na črnilu · ni za običajno besediloMah — UIDostopno besedilo in ikone
#738a494,91 : 1 na črniluKislo zelenaRedek aktiven ali potrjen signal
#c4ff6616,04 : 1 na črniluEditorialni glas, tehnična natančnost
Fraunces je omejen na kratke portfolio naslove. Manrope nosi UI in besedilo, JetBrains Mono pa oznake in kodo. Priročnik ohranja Manrope tudi v naslovih.
Jasni sistemi.
Berljivo besedilo za kompleksne produkte.
ARCH_LINUX / SYSTEM_READY
type-editorialclamp(3rem, 7.5vw, 7.5rem)
type-displayclamp(2.75rem, 5vw, 5rem)
type-h2clamp(1.75rem, 2.7vw, 2.7rem)
type-h3clamp(1.18rem, 1.55vw, 1.48rem)
type-body-lgclamp(1.04rem, 1.3vw, 1.2rem)
type-body1.0125rem
type-small0.875rem
type-caption0.75rem
4 px ritem
Razmiki so omejeni na dokumentirano lestvico. Kontrole so visoke najmanj 44 px, besedilo pa ostane približno med 60 in 75 znaki na vrstico.
1 / 0.25rem2 / 0.5rem3 / 0.75rem4 / 1rem6 / 1.5rem8 / 2rem12 / 3rem16 / 4rem24 / 6remMreža in skupna geometrija
12 stolpcev na namizju, 8 na tablici in 4 na mobilniku. Vsebina na ozkih zaslonih sledi vrstnemu redu dokumenta.
grid-columns12
grid-gap1.5rem
page-gutter2rem
control-height2.75rem
radius-control0.25rem
radius-card0.25rem
card-padding1.5rem
Mirne površine
Kartice si delijo radius, lestvico razmikov in neprosojno površino. Dvig je rezerviran za prekrivno navigacijo.
Mirna vsebinska kartica, brez dekorativnega dviga.
Kontrast in rob sta obvezna.Naslov, opis, metapodatki in eno jasno dejanje.
Kontrast in rob sta obvezna.Jasen rob in najmanjša višina iz skupnih tokenov.
Kontrast in rob sta obvezna.Dvig je rezerviran za odprto navigacijo.
Kontrast in rob sta obvezna.
Komponente in stanja
Vsaka interaktivna družina uporablja skupne tokene za rob, radius, dvig in fokus. Aktivno stanje ni nikoli sporočeno samo z barvo.
Gibanje pojasni stanje
Mikro odzivi trajajo 110–220 ms, menjava strani 300 ms in portal največ 420 ms. Reduced motion odstrani prostorski premik.
110ms / PRESS140ms / HOVER180ms / CONTROL220ms / REVEAL300ms / PAGE420ms / PORTAL MAXDostopnost je pogodba
Običajno besedilo dosega 4,5 : 1, velike oznake in ključni robovi 3 : 1. Fokus uporablja 3 px obris z odmikom, vse kontrole pa ostanejo tipkovnično dostopne.
TEXT ≥ 4.5:1UI ≥ 3:1TARGET ≥ 44pxFOCUS = OUTLINE + OFFSET
ARCH // GLITCH CORE
Indigo–lime sistem je projektna tema študije in priročnika, ne globalna identiteta E | T Digital. Stran Tema v priročniku dokumentira barve dejanskega zunanjega namiznega sistema, zato se njegove vrednosti namenoma razlikujejo od web UI tokenov.
ARCH črniloProjektni token
#10162aGlitch indigoProjektni token
#34365bSistemska sivkaProjektni token
#a79fcaSistemska zelenaProjektni token
#b7ee35