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 Spaceships identitet.
Versioner
Alla Spaceship-ikoner finns i två versioner: kontur (primär) och fylld (sekundär).
Konstruktion
Ikoner är utformade enligt definierade regler — från basrutnät till linjeparametrar — vilket säkerställer konsekventa och balanserade resultat.
Storlek
Ikoner är skalbara i designen och bör 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änder ikoner Spaceship Design System-färger.
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 i hela 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 proportionerligt.
Använd inte ikoner som är större än 40x40px. Sträva efter balans mellan elementen.
Använd inte nyanser eller skuggor.