EchoPM varumärkesriktlinjer
Logotyper, färger, typografi och användningsregler för marknadsföring, produkt och partnermaterial. Ladda ner tillgångar direkt eller referera till de delade design-tokens i koden.
Varumärkespaket designat av Anymark · Juni 2026
Översikt
EchoPM:s visuella identitet centreras kring en lugn grön palett, Figtree-typografi och en kompass-logotyp. Använd dessa riktlinjer för att hålla presentationer, kampanjer och co-branded material konsekventa med produktupplevelsen på echopm.app.
Logotyp
Använd vektorlogotypen när det är möjligt. Byt till den vita rasterlogotypen på mörka eller fotografiska bakgrunder.
Färg
Primära tokens bör täcka de flesta ytor. Utökade nyanser stödjer hover-tillstånd, nyanser och betoning.
Primära tokens
Primär (#3D7C62) används för CTA:er, aktiva tillstånd och viktiga varumärkesögonblick. Mörk (#1F2937) används för brödtext och stark UI-krom. Vit (#FFFFFF) används för bakgrunder och negativt utrymme.
Primary
#3D7C62
primary
Dark
#1F2937
dark
White
#FFFFFF
white
Use with dark text
Utökad palett
Nyans från 100 (ljusaste nyans) till 800 (mörkaste) stödjer hover-tillstånd, avskiljare, märken och subtila ytor utan att introducera avvikande färger.
800
#193329
color800
700
#2A5544
color700
600
#3B785F
color600
500
#3D7C62
color500
400
#65B393
color400
300
#87C4AB
color300
Use with dark text
200
#AAD5C3
color200
Use with dark text
100
#CCE6DB
color100
Use with dark text
Verifiera WCAG AA-kontrast (4.5:1) innan någon text/bakgrundskombination skickas. Reservera den primära gröna för funktionella accenter – inte dekorativa fyllningar.
Typografi
Figtree är det primära typsnittet för marknadsföring och produkt – det matchar EchoPM-logotypen. Geist Mono är reserverat för kod och tekniska etiketter.
Sans / UI
Att göra uthyrning enkelt och effektivt
Figtree — brödtext, navigering, formulär och allmän UI.
Display / rubriker
Fastighetsoperationer, anpassade
Figtree via font-serif — avsnittsrubriker och marknadsföringsdisplaytyp.
Monospace
ECHOPM_BRAND.primary · #3D7C62
Geist Mono — kodsnuttar, tokens och teknisk metadata.
Gör och gör inte
Gör
- Använd SVG-logotypen när målet stöder vektorgrafik.
- Använd den vita logotypen på mörka eller fotografiska bakgrunder.
- Håll klart utrymme runt logotypen lika med minst höjden på ikonen.
- Reservera primärgrön för CTA:er, aktiva tillstånd och avsiktliga varumärkesögonblick.
- Verifiera kontrast när du kombinerar nyanser från den utvidgade paletten.
Gör inte
- Rotera, sträck, krossa eller förvräng logotypen.
- Lägg till gradienter, skuggor, konturer eller linjer till logotypen.
- Ändra färg på logotypen utanför denna palett.
- Placera logotypen på bakgrunder med låg kontrast eller röriga mönster.
- Använd primärgrön dekorativt – det är en funktionell accent.
Nedladdningar
Produktion-klara filer hämtade från echopm.app. Högerklicka eller använd nedladdningsknapparna ovan för att spara lokalt.
Animerade varumärken