Ikoner
Spaceship-ikoner översätter komplexa handlingar och idéer till omedelbart igenkännbara symboler, vilket hjälper användare att navigera och interagera enkelt.
Universella men ändå distinkta, våra ikoner är de minsta byggstenarna i varumärket, utformade för omedelbar igenkänning samtidigt som de tydligt behåller Spaceship-identiteten.
Versioner
Alla Spaceship-ikoner finns i två versioner: kontur (primär) och fylld (sekundär).
Konstruktion
Ikoner är utformade enligt definierade regler — från grundrutnät till linjeparametrar — vilket säkerställer konsekventa och balanserade resultat.
Storlek
Skalbara i designen bör ikoner användas i fem storlekar för att bevara tydlighet och visuell harmoni i hela systemet.
Färger
Färg är ett viktigt element som hjälper användare att identifiera sina produkter enklare i ett visst gränssnitt. För att säkerställa konsekvens i dessa UI-sammanhang används Spaceship Design System-färger för ikoner.
Varumärkesfärger
Som Spaceships kärnfärger bör dessa vara det primära valet för ikoner — oavsett om det gäller funktionella sammanhang som plattformens gränssnitt eller mer illustrativa användningar, såsom funktionsrepresentation på produktsidor. Se färgsidan för mer information.
Produktfärger
En produkts huvudfärger ska användas på dess respektive ikoner. Detta är avgörande för produktigenkänning och medvetenhet inom Spaceship-ekosystemet.
Notifikationsfärger
Använd notifikationsfärger för att förstärka varningsmeddelanden. De ska endast användas på varningsikoner, med vissa undantag där en annan ikon också representerar tillstånd för framgång, fel eller varning.
Vägledning
Här är några exempel på vad du bör undvika när du använder ikoner.
Förvräng, rotera eller vänd aldrig ikoner. Skala alltid proportionellt.
Använd inte ikoner större än 40x40px. Sträva efter balans mellan elementen.
Använd inte nyanser eller skuggor.