Designsystem / Version 1.0

Samma rötter.
Eget uttryck.

En teknisk, varm och avskalad identitet. Syvos färger och Manrope möter rutnät, mörka ytor och en kommandoprompt.

Ladda ner profilpaketet ↓
01 / Logotyp

En tydlig avsändare.

Ljus Syvo Labs-logotyp på mörk bakgrund
Mörk Syvo Labs-logotyp på ljus bakgrund

Ordmärke: syvo labs>_
Använd originalets vektorbanor. Behåll proportioner och limegrön prompt. Friyta minst promptens höjd på alla sidor.

Symbol: s>_
För avatar, favicon och små ytor. Använd den färdiga symbolfilen. Sätt aldrig om logotypen med vanlig text.

02 / Färg

Mörk bas. Grönt ljus.

Lab black#1B261E
Syvo olive#27352A
Prompt lime#D9FC75
Warm paper#FAF7EF
Soft melon#E6EDCC
Signal muted#B5C2B0

Bas och rytm
Lab black för stora mörka ytor. Olive binder ihop med Syvo. Paper och Melon ger text och projekt utrymme.

Lime med avsikt
För huvudknappar, prompt och små markörer. Mörk text på lime. Använd aldrig lime som brödtext på en ljus yta.

03 / Typografi

Rakt, med karaktär.

MANROPE / 400–800

Aa Bb Cc
Åäö 0123>_

Rubriker 700–800. Brödtext 400–500. Generös radavstånd och korta textrader. Samma grundtypsnitt som Syvo, med sans serif även i rubrikerna.

ui-monospace / SFMono-Regular / Consolas

PROJEKT_001 → UTFORSKA. BYGG. PROVA.
Metadata, etiketter och tekniska detaljer.
04 / Former & komponenter

Precision utan brus.

Layout och former
8 px grundrytm. Innehåll upp till 1200 px. Tunna linjer, raka sektioner och lätt rundade knappar. Rutnät är en diskret bakgrund, inte innehåll.

Bildspråk och rörelse
Verkliga skärmbilder och detaljer ur byggena. Visa vad projektet gör. Korta, lugna övergångar och respekt för minskad rörelse.

05 / Tonalitet

Byggt av en människa.

Skriv enkelt, personligt och konkret. Använd jag när Hugo är avsändare. Berätta vad projektet gör och vad som lärdes på vägen.

Skilj på idé, prototyp och något som används. Beskriv verkliga funktioner. Låt arbetet stå för intresset, utan stora löften.

Syvo Labs befintliga X-header: ordmärke, olivgrönt rutnät och limegröna hörn.