Wytyczne marki

Marka

Wszystko, czego potrzebujesz, by umieścić logo Vodlix na stronie, w prezentacji, artykule czy na banerze wydarzenia — pliki, kolory, kroje pisma i kilka rzeczy, których nie wolno z nimi robić. Bez formularza zgody i bez czekania na nas.

Pobierz wszystkie materiały (ZIP)Pojedyncze pliki

Logo

Cztery wersje, po jednej na każdy rodzaj tła. Wybieraj według powierzchni, na której je umieszczasz, a nie według pliku, który akurat masz.

Na białych i jasnych powierzchniach — logo na jasne tło. To główny znak i właściwy wybór domyślny.

Na czarnych i ciemnych powierzchniach — logo na ciemne tło. Czerwony znak jest wyraźnie czytelny na niemal czarnym tle.

Na czerwieni marki i na gradiencie — wyłącznie monochromatyczne białe. Czerwony znak na czerwonym tle jest nieczytelny.

Sama ikona — w pełnym kolorze na neutralnym tle, biała na ciemnym lub czerwonym, czarna na jasnym, gdy trzeba zrezygnować z koloru. Używaj jej tylko tam, gdzie nazwa „Vodlix” jest już obecna: jako awatara, favicony, kafelka aplikacji.

Logo na jasne tło ma nieco grubszy logotyp niż wersja na ciemne tło. To celowe i tak pozostanie — kompensuje to, że pismo na jasnym tle wydaje się cieńsze. Używaj każdej wersji na tle, dla którego jest przeznaczona, zamiast samodzielnie korygować grubość.

Używaj SVG wszędzie, gdzie pozwala na to medium — pozostaje ostry w każdym rozmiarze i poprawnie się drukuje. Pliki PNG są do miejsc, które nie obsługują grafiki wektorowej.

Pole ochronne i minimalny rozmiar

Zostaw logo przestrzeń i nie zmniejszaj go poniżej progu, w którym logotyp przestaje być czytelny.

½ wysokości logo

Pole ochronne

Z każdej strony zachowaj wolny margines równy co najmniej połowie wysokości logo. Nic — tekst, krawędź obrazu, inne logo, ramka — nie może znaleźć się w tym obszarze.

Minimalny rozmiar

Poniżej tych wartości logotyp zaczyna się zlewać. Jeśli potrzebujesz mniejszego znaku, użyj samej ikony.

Pełne logo — 120 px / 25 mm szerokości

Ikona — 24 px / 8 mm szerokości

Kolor

Czerwień marki to #E61D2C. To akcent, nie tło — Vodlix jest marką biało-czarną, którą czerwień jedynie punktuje, więc czerwone panele na całą szerokość nie są w naszym stylu.

Marka

Czerwień marki#E61D2C

Czerwień, hover#DB1223

Jasna czerwień#FDEDEE

Neutralne — jasne

Tekst główny#0C0C0E

Tekst drugorzędny#3A3A42

Wyciszony#8F8F99

Linia włosowa#E7E7EC

Powierzchnia#FFFFFF

Strona#FBFBFC

Ciemny pas#101014

Neutralne — ciemne

Strona#0E0E11

Powierzchnia#16161A

Tekst główny#F5F5F7

Linia włosowa#26262C

Czerwień, hover#F03935

Gradient

Stop 1#E61D2C

Stop 2#FF0000

Stop 3#EEAB6E

Stop 4#F89436

Gradient jest wyłącznie dla sekcji hero i typografii display — nigdy na ikonie, plakietce ani przycisku. Logo na gradiencie jest monochromatyczne białe.

Typografia

Dwa kroje, oba darmowe i dostępne w Google Fonts, więc odwzorujesz układ Vodlix bez kupowania jakiejkolwiek licencji.

Merriweather Sans — display

Nagłówki, tytuły kart i planów, liczby w statystykach, nazwa marki w stopce. Grubości 400–700.

Noto Sans — tekst i interfejs

Wszystko inne: tekst główny, etykiety, przyciski, tabele. Grubości 400–700. Siostrzane kroje z rodziny Noto obejmują arabski, chiński i japoński — dlatego to właśnie krój tekstowy.

Jeśli nie możesz wczytać żadnego z nich

Użyj systemowego kroju bezszeryfowego (system-ui, następnie Helvetica lub Arial). Nie zastępuj go krojem szeryfowym ani zwężonym (condensed).

Nagłówek strony44px

Nagłówek sekcji28px

Akapit wprowadzający — wyraźnie o stopień mniejszy niż nagłówek, nie w rozmiarze display.18px

Tekst główny. Vodlix daje ci platformę, jaką wielkie serwisy streamingowe zbudowały dla siebie — stronę, aplikacje, subskrypcje i analitykę — bez zespołu inżynierów.15.5px

Metadane · 27 sie 2026 · 6 min czytania13px

$1,550 / miesiąc — cyfry tabelaryczne

Nagłówki mają odstęp międzyliterowy −2%. Liczby — ceny, statystyki, wartości w tabelach — składa się cyframi tabelarycznymi, aby kolumny były wyrównane.

Czego nie robić

Logo to niezmienna grafika. Umieść je, skaluj proporcjonalnie i niczego więcej nie zmieniaj.

Nie zmieniaj jego koloruŻadnych kolorów twojej marki na naszym znaku. Jedyne alternatywy to czerń lub biel i obie są dostępne jako pliki.

Nie rozciągaj ani nie spłaszczaj goSkaluj oba wymiary jednocześnie. Jeśli się nie mieści, użyj ikony.

Nie dodawaj efektówBez cienia, poświaty, fazowania, obrysu ani wypełnienia gradientem.

Nie kładź wersji na jasne tło na ciemnym podłożuJej logotyp jest niemal czarny i prawie znika. Użyj pliku na ciemne tło lub wersji monochromatycznej białej.

Nie odtwarzaj logotypuNie jest złożony fontem, którym dałoby się go przepisać. Zawsze umieszczaj dostarczony plik.

Nie obracaj go ani nie przycinajLogo jest zawsze poziome i kompletne. Żadnych skosów, żadnego kadrowania do narożnika znaku.

Ponadto: nie umieszczaj logo w żadnym własnym kształcie ani ramce, nie używaj go w sposób sugerujący partnerstwo lub rekomendację, na które się nie zgodziliśmy, i nie używaj go jako części nazwy ani logo własnego produktu.