# Paczka brandingowa — Łódzka Galeria Sztuki

Podstawowy pakiet identyfikacji wizualnej dla grafika. Wszystkie wersje logo są
wektorowe (SVG, tekst na krzywych — nie wymagają fontów), rastry PNG służą jako
podgląd i do zastosowań, gdzie SVG nie wchodzi w grę.

## Koncepcja znaku

Sygnet to neoplastyczne „okno": płaszczyzna czerwieni z białą literą **Ł**
(Space Grotesk Bold — ten sam krój co logotyp) oraz kolumna płaszczyzn
żółć / biel / błękit, rozdzielonych liniami czerni. Kompozycja cytuje motywy
serwisu (siatka „okno-16", pasek akcentu) i tradycję łódzkiej awangardy
(Sala Neoplastyczna Strzemińskiego w Muzeum Sztuki). Kreska ukośna litery Ł
wnosi jedyny skos do świata pionów i poziomów — celowy akcent dynamiczny.

## Struktura

```
brand/
├── logo/            SVG — pliki źródłowe znaku (używać w pierwszej kolejności)
│   ├── pdf/         wektorowe PDF do przekazania do druku
│   └── png/         eksporty rastrowe (podgląd / narzędzia bez obsługi SVG)
├── favicon/         komplet ikon przeglądarkowych i PWA
├── social/          awatar i obraz Open Graph
├── kolory/          paleta (MD + JSON + GPL dla GIMP/Inkscape/Krita)
└── typografia/      rodziny, wagi, skala, linki do fontów
```

## Wersje logo i kiedy ich używać

| Plik | Zastosowanie |
|------|--------------|
| `logo-poziome.svg` | **wersja podstawowa** — nagłówki dokumentów, stopki, materiały szerokie; tła jasne |
| `logo-poziome-ciemne-tlo.svg` | jak wyżej, tła ciemne (tekst w bieli, „SZTUKI" w czerwieni jasnej) |
| `logo-pionowe.svg` | formaty wąskie/kwadratowe: plakat, rollup, awers ulotki; tła jasne |
| `logo-pionowe-ciemne-tlo.svg` | jak wyżej, tła ciemne |
| `logotyp-tekstowy*.svg` | sam napis (bez sygnetu) — konteksty, gdzie sygnet występuje osobno albo brak miejsca w pionie |
| `sygnet.svg` | samodzielny znak: awatary, ikony aplikacji, pieczęć, duże rozmiary |
| `*-mono-czern.svg` | druk jednokolorowy, faks, grawer, pieczątki — tła jasne |
| `*-mono-biel.svg` | jednokolorowe na tłach ciemnych/fotografii |
| `pasek-akcentu.svg` | element firmowy (4 równe segmenty: czerwień→żółć→błękit→czerń) do nagłówków dokumentów, stopek maili itp. |

Warianty mono zachowują tonalność wersji kolorowej i część pól mają **wyciętą**
(przezroczystą): w `mono-czern` wycięte są litera Ł oraz jasne segmenty kolumny
(pozycje żółci i bieli); w `mono-biel` wycięte są litera Ł oraz segment ciemny
(pozycja błękitu), a jasne segmenty są wypełnione bielą. Wycięciami prześwituje
tło — nie podkładać pod znak mono dodatkowej płaszczyzny.

## Zasady użycia

- **Pole ochronne:** wokół logo zachować odstęp równy szerokości kolumny sygnetu
  (⅕ boku sygnetu); dla logotypu tekstowego — wysokość wersalika.
- **Rozmiary minimalne (cyfrowo):** sygnet 24 px; logo poziome wys. 28 px;
  logo pionowe szer. 96 px; logotyp tekstowy wys. 16 px.
  Poniżej 24 px stosować wyłącznie `favicon/favicon.svg` (uproszczony znak).
- **Rozmiary minimalne (druk):** sygnet 8 mm; poziome wys. 10 mm; pionowe szer. 30 mm;
  logotyp tekstowy wys. 5 mm.
- Nie zmieniać kolorów, proporcji ani układu; nie dodawać cieni, obrysów,
  gradientów i zaokrągleń (marka nie używa zaokrągleń w ogóle).
- Nie składać nazwy z sygnetem w innych układach niż dostarczone.
- Na fotografiach: użyć wariantu mono-biel lub podłożyć płaszczyznę bieli/czerni.

## Favicon / ikony aplikacji

| Plik | Rola |
|------|------|
| `favicon.svg` | ikona kart przeglądarki (uproszczona: czerwień + Ł, czytelna od 16 px) |
| `favicon.ico` | 16/32/48 px (starsze przeglądarki, Windows) |
| `favicon-16/32/48.png` | pojedyncze rozmiary |
| `icon-192.png`, `icon-512.png` | PWA / Android (pełny sygnet) |
| `icon-maskable-512.png` | Android maskable — sygnet w strefie bezpiecznej na bieli |
| `apple-touch-icon-180.png` | iOS (bez przezroczystości) |

## Social

- `avatar-1024.png` — awatar profilowy (sygnet z marginesem, bezpieczny przy
  kadrowaniu do koła).
- `og-obraz-1200x630.png` — statyczny obraz Open Graph (serwis generuje własny
  dynamicznie; ten jest do użycia poza serwisem).

## Druk

`logo/pdf/` zawiera wektorowe PDF-y wszystkich wersji (geometria 1:1 z SVG).
Kolory w PDF-ach i SVG są zapisane w **RGB** — separację CMYK wykonuje grafik
lub drukarnia według wartości orientacyjnych z `kolory/paleta.md`, ostatecznie
potwierdzonych na proofie. Do grawerowania i pieczątek używać wariantów mono.

## Źródła

Kolory i typografia odwzorowują design system serwisu (`src/app/globals.css`).
Wygenerowano z krzywych Space Grotesk Bold (SIL OFL 1.1); pliki logo nie osadzają
fontu, więc nie niosą zobowiązań licencyjnych.