openpencil/packages/docs/pl/reference/figma-compatibility.md

# Matryca funkcji Figmy

Porównanie funkcja po funkcji możliwości Figma Design z aktualnym stanem implementacji Open Pencil.

::: tip Legenda statusów
✅ Obsługiwane — funkcja działa w pełni · 🟡 Częściowe — podstawowe zachowanie istnieje, brakuje niektórych pod-funkcji · 🔲 Jeszcze nie zaimplementowane
:::

**Pokrycie:** 94 ze 158 elementów Figmy uwzględnionych — 76 ✅ w pełni obsługiwanych, 18 🟡 częściowych, 64 🔲 oczekujących. Ostatnia aktualizacja: 2026-03-07.

## Interfejs i nawigacja

| Funkcja | Status | Uwagi |
|---------|--------|-------|
| Pasek narzędzi projektowych | ✅ | Pasek dolny (styl UI3): Zaznacz, Frame, Sekcja, Prostokąt, Elipsa, Linia, Tekst, Ręka, Pióro |
| Panel warstw (lewy panel boczny) | ✅ | Widok drzewa z rozwijaniem/zwijaniem, zmianą kolejności, przełącznikiem widoczności; zmienna szerokość |
| Panel stron | ✅ | Dodaj, usuń, zmień nazwę stron; stan viewportu per strona |
| Panel właściwości (prawy panel boczny) | ✅ | Sekcje: Wygląd, Wypełnienie, Obrys, Efekty, Typografia, Layout, Pozycja; zmienna szerokość |
| Zoom i panorama | ✅ | <kbd>Ctrl</kbd> + scroll, pinch, <kbd>⌘</kbd><kbd>+</kbd> / <kbd>⌘</kbd><kbd>−</kbd> / <kbd>⌘</kbd><kbd>0</kbd>, spacja+przeciągnij, środkowy przycisk myszy, narzędzie ręki (H) |
| Linijki canvasu | ✅ | Linijki góra/lewo z pasmami zaznaczenia i badge'ami współrzędnych |
| Kolor tła canvasu | ✅ | Tło per strona przez panel właściwości |
| Prowadnice canvasu | 🔲 | Figma obsługuje przeciągane prowadnice z linijek |
| Menu akcji / paleta poleceń | 🔲 | Szybkie wyszukiwanie akcji Figmy |
| Menu kontekstowe | ✅ | Prawy klik z schowkiem, kolejnością-z, grupowaniem, komponentem, widocznością, blokadą, przenieś-na-stronę |
| Skróty klawiszowe | 🟡 | Podstawowe + komponenty + kolejność-z + widoczność/blokada zaimplementowane; Skala, Strzałka, Ołówek, odbijanie, formatowanie tekstu jeszcze nie podłączone |
| Szukaj i zamień | 🔲 | Wyszukiwanie/zamiana tekstu w dokumencie |
| Widok konturów warstw | 🔲 | Widok wireframe wszystkich warstw |
| Niestandardowe miniatury | 🔲 | Miniatura generowana przy eksporcie, ale bez selektora |
| Ustawienia wartości nudge | 🔲 | Domyślnie 1px/10px; Figma pozwala na wartości niestandardowe |
| Menu aplikacji (tryb przeglądarkowy) | ✅ | Menu Plik, Edycja, Widok, Obiekt, Tekst, Rozmieszczenie; Tauri używa natywnych menu |
| Narzędzia AI | 🟡 | 90+ narzędzi przez Anthropic, OpenAI, Google AI, OpenRouter + serwer MCP; bez obrazów generowanych przez AI ani wyszukiwania AI jeszcze |

## Warstwy i kształty

| Funkcja | Status | Uwagi |
|---------|--------|-------|
| Narzędzia kształtów (Prostokąt, Elipsa, Linia, Wielokąt, Gwiazda) | ✅ | Wszystkie podstawowe typy kształtów; boki wielokąta i promień wewnętrzny gwiazdy konfigurowalne |
| Ramki | ✅ | Przycinanie zawartości, niezależny układ współrzędnych |
| Grupy | ✅ | <kbd>⌘</kbd><kbd>G</kbd> grupowanie, <kbd>⇧</kbd><kbd>⌘</kbd><kbd>G</kbd> rozgrupowanie |
| Sekcje | ✅ | Pigułki tytułu, auto-adopcja nakładających się węzłów, tekst adaptacyjny do luminancji |
| Narzędzie łuku (łuki, półkola, pierścienie) | ✅ | arcData z kątem początkowym/końcowym i promieniem wewnętrznym |
| Narzędzie ołówka (odręczne) | 🔲 | Narzędzie rysowania odręcznego Figmy |
| Maski | 🔲 | Maski kształtów do przycinania warstw |
| Typy warstw i hierarchia | ✅ | 17 typów węzłów, płaska Mapa + drzewo rodzic-dziecko |
| Zaznaczanie warstw | ✅ | Klik, shift-klik, zaznaczenie markerowe |
| Wyrównanie i pozycja | ✅ | Pozycja, rotacja, wymiary w panelu |
| Kopiuj i wklej obiekty | ✅ | Standardowy schowek + format binarny Kiwi Figmy |
| Skaluj warstwy proporcjonalnie | 🟡 | Shift-zmiana rozmiaru utrzymuje proporcje; brak dedykowanego narzędzia Scale (K) |
| Zablokuj i odblokuj warstwy | ✅ | <kbd>⇧</kbd><kbd>⌘</kbd><kbd>L</kbd> przełącza blokadę |
| Przełącz widoczność warstwy | ✅ | Ikona oka w panelu + skrót <kbd>⇧</kbd><kbd>⌘</kbd><kbd>H</kbd> |
| Zmień nazwę warstw | ✅ | Dwuklik - zmiana nazwy inline; <kbd>Enter</kbd>/<kbd>Escape</kbd>/blur aby zatwierdzić |
| Przenieś na wierzch / Wyślij na spód | ✅ | Skróty ] i [; też w menu kontekstowym |
| Przenieś na stronę | ✅ | Przenoszenie węzłów między stronami przez menu kontekstowe |
| Ograniczenia (responsywna zmiana rozmiaru) | 🔲 | Przypięcie krawędzi/centrum dla zachowania resize rodzica |
| Inteligentna selekcja (rozmieść/wyrównaj) | 🔲 | Równomierne rozmieszczanie i wyrównywanie |
| Prowadnice layoutu (kolumny, wiersze, siatka) | 🔲 | Prowadnice kolumn/wierszy/siatki na ramkach |
| Mierzenie odległości między warstwami | 🔲 | Alt-najechanie pokazuje odległości |
| Edycja obiektów zbiorowo | ✅ | Panel wielokrotnego zaznaczenia: wspólne wartości normalne, różne pokazują "Mixed" |
| Identyfikacja pasujących obiektów | 🔲 | Znajdowanie podobnych warstw |
| Kopiuj/wklej właściwości | 🔲 | Kopiowanie wypełnienia/obrysu/efektów między warstwami |
| Relacje rodzic-dziecko | ✅ | Pełna hierarchia z parentIndex, re-parentowanie przez przeciąganie |

## Narzędzia wektorowe

| Funkcja | Status | Uwagi |
|---------|--------|-------|
| Sieci wektorowe | ✅ | Model kompatybilny z Figmą, nie proste ścieżki |
| Narzędzie pióro | ✅ | Punkty narożne, krzywe Béziera, ścieżki otwarte/zamknięte |
| Edytuj warstwy wektorowe | 🟡 | Tworzenie działa; zaawansowana edycja wierzchołków ograniczona |
| Operacje booleowskie (Suma, Różnica, Przecięcie, Wykluczenie) | 🔲 | Łączenie kształtów operacjami booleowskimi |
| Spłaszczanie warstw | 🔲 | Łączenie ścieżek wektorowych |
| Konwersja obrysów na ścieżki | 🔲 | Polecenie Outline Stroke |
| Konwersja tekstu na ścieżki | 🔲 | Spłaszczanie tekstu na kontury wektorowe |
| Narzędzie shape builder | 🔲 | Interaktywne narzędzie booleowskie |
| Offset ścieżki | 🔲 | Inset/outset ścieżki wektorowej |
| Uproszczenie ścieżki | 🔲 | Redukcja liczby punktów wektorowych |

## Tekst i typografia

| Funkcja | Status | Uwagi |
|---------|--------|-------|
| Narzędzie tekstowe i edycja inline | ✅ | Natywna edycja na canvasie, phantom textarea, style run (<kbd>⌘</kbd><kbd>B</kbd> / <kbd>I</kbd> / <kbd>U</kbd>, przycisk S) |
| Renderowanie tekstu (Paragraph API) | ✅ | CanvasKit Paragraph do kształtowania, łamania linii, metryk |
| Ładowanie czcionek (czcionki systemowe) | ✅ | Inter domyślny, font-kit w Tauri z cache OnceLock, queryLocalFonts w przeglądarce |
| Rodzina i grubość czcionki | ✅ | FontPicker z wirtualnym scrollem, wyszukiwaniem, podglądem CSS |
| Rozmiar czcionki i interlinia | ✅ | Edytowalne w sekcji typografii |
| Wyrównanie tekstu | 🟡 | Podstawowe wyrównanie; Figma ma wyrównanie pionowe i tryby auto-szerokość/wysokość |
| Style tekstu | 🟡 | Pogrubienie/kursywa/podkreślenie/przekreślenie per zaznaczenie; brak presetów wielokrotnego użytku |
| Tryby zmiany rozmiaru tekstu | 🔲 | Tryby auto-szerokość, auto-wysokość, stały-rozmiar Figmy |
| Listy punktowane i numerowane | 🔲 | Formatowanie list w tekście |
| Linki w tekście | 🔲 | Hiperlinki w treści tekstowej |
| Emoji i symbole inteligentne | 🔲 | Renderowanie emoji i znaków specjalnych |
| Funkcje OpenType | 🔲 | Ligatury, alternatywy stylistyczne, cyfry tabelaryczne |
| Czcionki zmienne | 🔲 | Regulowane osie czcionki (grubość, szerokość, pochylenie) |
| Obsługa tekstu CJK | 🔲 | Renderowanie tekstu chińskiego, japońskiego, koreańskiego |
| Obsługa tekstu RTL | 🔲 | Layout tekstu od prawej do lewej |
| Czcionki ikon | 🔲 | Specjalna obsługa glifów czcionek ikon |

## Kolor, gradienty i obrazy

| Funkcja | Status | Uwagi |
|---------|--------|-------|
| Wybieracz kolorów (HSV) | ✅ | Kwadrat HSV, slider odcienia, slider alfa, wejście hex |
| Wypełnienia jednolite | ✅ | Kolor hex z przezroczystością |
| Gradient liniowy | ✅ | Punkty stopu, uchwyty transformacji |
| Gradient radialny | ✅ | Renderowanie przez shadery CanvasKit |
| Gradient kątowy | ✅ | Obsługa gradientu sweep/stożkowego |
| Gradient diamentowy | ✅ | Gradient diamentowy czteropunktowy |
| Wypełnienia obrazem | ✅ | Dekodowane z danych blob z trybami skali (fill, fit, crop, tile) |
| Wypełnienia wzorem | 🔲 | Powtarzające się wypełnienia obrazem/wzorem |
| Tryby mieszania | 🔲 | Tryby mieszania warstwy i wypełnienia (multiply, screen, overlay, itp.) |
| Dodawanie obrazów i wideo | 🟡 | Wypełnienia obrazem renderowane; brak importu drag-and-drop ani obsługi wideo |
| Regulacja właściwości obrazu | 🔲 | Ekspozycja, kontrast, nasycenie, itp. |
| Przycinanie obrazu | 🔲 | Interaktywne przycinanie obrazów |
| Narzędzie kroplomierza | 🔲 | Próbkowanie kolorów z canvasu |
| Edycja koloru w selekcji mieszanej | 🔲 | Regulacja kolorów w heterogenicznej selekcji |
| Modele kolorów (RGB, HSL, HSB, Hex) | 🟡 | HSV + Hex w wybieraczu; brak przełączania trybu HSL lub RGB |

## Efekty i właściwości

| Funkcja | Status | Uwagi |
|---------|--------|-------|
| Cień rzutowany | ✅ | Offset, promień rozmycia, kolor przez filtry CanvasKit |
| Cień wewnętrzny | ✅ | Efekt cienia wewnętrznego |
| Rozmycie warstwy | ✅ | Rozmycie gaussowskie na warstwie |
| Rozmycie tła | ✅ | Rozmycie zawartości za warstwą |
| Rozmycie pierwszego planu | ✅ | Rozmycie na pierwszym planie |
| Grubość obrysu | ✅ | Konfigurowalny w panelu właściwości |
| Zakończenie obrysu (round, square, arrow) | ✅ | `NONE`, `ROUND`, `SQUARE`, `ARROW_LINES`, `ARROW_EQUILATERAL` |
| Złączenie obrysu (miter, bevel, round) | ✅ | Wszystkie trzy typy złączeń |
| Wzory przerywane | ✅ | Wzór obrysu dash-on/dash-off |
| Promień narożnika | ✅ | Jednolity i per narożnik z niezależnym przełącznikiem |
| Wygładzanie narożnika (styl iOS) | 🔲 | Ciągłe zaokrąglanie narożników Figmy |
| Wielokrotne wypełnienia/obrysy na warstwę | 🔲 | Figma pozwala na nakładanie wypełnień i obrysów |

## Auto Layout

| Funkcja | Status | Uwagi |
|---------|--------|-------|
| Przepływ poziomy i pionowy | ✅ | Silnik flexbox Yoga WASM |
| Przełącz auto layout (<kbd>⇧</kbd><kbd>A</kbd>) | ✅ | Przełącz na ramce lub owijaj zaznaczenie |
| Gap (odstęp między dziećmi) | ✅ | Konfigurowalny w panelu właściwości |
| Padding (jednolity i per strona) | ✅ | Wszystkie cztery strony niezależnie |
| Justify content | ✅ | Start, center, end, space-between |
| Align items | ✅ | Start, center, end, stretch |
| Wymiarowanie dzieci (stałe, wypełnij, dopasuj) | ✅ | Tryby wymiarowania per dziecko |
| Wrap | ✅ | Flex wrap dla layoutu wieloliniowego |
| Przepływ auto layout siatka | ✅ | CSS Grid przez fork Yoga — ścieżki kolumn/wierszy, odstępy, spany |
| Przepływy połączone (zagnieżdżone) | ✅ | Zagnieżdżone ramki auto-layout z różnymi kierunkami |
| Zmiana kolejności przeciąganiem w auto layout | ✅ | Wizualny wskaźnik wstawiania |
| Min/max szerokość i wysokość | 🔲 | Figma obsługuje ograniczenia min/max |

## Komponenty i systemy projektowe

| Funkcja | Status | Uwagi |
|---------|--------|-------|
| Tworzenie komponentów | ✅ | Tworzenie z ramki/grupy; UI tekstu, widoczności, zamiany instancji i wariantów |
| Zestawy komponentów | ✅ | Wielowymiarowe niepełne warianty, walidacja duplikatów i domyślny wariant w lewym górnym rogu |
| Instancje komponentów | ✅ | Przeglądanie Assets, wstawianie, edytowalne właściwości i nadpisania, synchronizacja i przegląd aktualizacji |
| Warianty | ✅ | Tworzenie, przełączanie instancji i wariant zastępczy w lewym górnym rogu |
| Właściwości komponentu | ✅ | Tekst, widoczność logiczna i zamiana instancji |
| Propagacja nadpisań | ✅ | Zmiany w głównym komponencie propagowane; nadpisania zachowane |
| Zmienne (kolor, liczba, string, boolean) | 🟡 | `COLOR` z pełnym UI; `FLOAT`/STRING/BOOLEAN zdefiniowane bez UI edycji |
| Kolekcje i tryby zmiennych | 🟡 | Kolekcje, tryby, zmiana activeMode działają; brak UI tematyzacji |
| Style (kolor, tekst, efekt, layout) | 🔲 | Presety stylów wielokrotnego użytku |
| Biblioteki (publikuj, udostępniaj, aktualizuj) | ✅ | Niezmienne rewizje lokalne/z pamięci masowej, włączanie, selektywna publikacja, przegląd aktualizacji, tryb offline i zapis w `.fig` |
| Odłącz instancję | ✅ | <kbd>⌥</kbd><kbd>⌘</kbd><kbd>B</kbd> konwertuje instancję na ramkę |
| Przejdź do głównego komponentu | ✅ | Nawigacja do komponentu źródłowego, cross-page |

## Prototypowanie

| Funkcja | Status | Uwagi |
|---------|--------|-------|
| Połączenia prototypu | 🔲 | Planowane na Fazę 6 |
| Wyzwalacze (klik, najechanie, przeciągnięcie, itp.) | 🔲 | Planowane na Fazę 6 |
| Akcje (nawiguj, overlay, scroll, itp.) | 🔲 | Planowane na Fazę 6 |
| Animacje i przejścia | 🔲 | Planowane na Fazę 6 |
| Smart animate | 🔲 | Auto-animowanie pasujących warstw |
| Overlaye | 🔲 | Prototypowanie modalne/popover |
| Zachowanie scroll i overflow | 🔲 | Przewijalne ramki w prototypach |
| Przepływy prototypu | 🔲 | Nazwane punkty startowe |
| Zmienne w prototypach | 🔲 | Logika warunkowa ze zmiennymi |
| Easing i animacje sprężynowe | 🔲 | Niestandardowe krzywe animacji |
| Prezentuj i odtwarzaj prototypy | 🔲 | Pełnoekranowy widok prototypu |

## Import i eksport

| Funkcja | Status | Uwagi |
|---------|--------|-------|
| Import pliku .fig | ✅ | Pełny kodek Kiwi: 194 definicje, ~390 pól per `NodeChange` |
| Eksport pliku .fig | ✅ | Kodowanie Kiwi + kompresja Zstd + generowanie miniatur |
| Zapisz / Zapisz jako | ✅ | <kbd>⌘</kbd><kbd>S</kbd> / <kbd>⇧</kbd><kbd>⌘</kbd><kbd>S</kbd>; natywne dialogi (Tauri), File System Access API (Chrome/Edge), fallback pobierania (Safari) |
| Schowek Figmy (wklej) | ✅ | Dekodowanie binarnego Kiwi ze schowka Figmy |
| Schowek Figmy (kopiuj) | ✅ | Kodowanie binarnego Kiwi czytelnego przez Figmę |
| Import pliku Sketch | 🔲 | Parsowanie plików .sketch |
| Eksport obrazu/SVG | 🟡 | PNG/JPG/WEBP z selektorem skali i podglądem; WEBP/SVG export ✅; PDF export 🔲 |
| Historia wersji | 🔲 | Przeglądanie i przywracanie poprzednich wersji |
| Kopiowanie zasobów między narzędziami | 🟡 | Schowek Figmy działa; Kopiuj jako tekst/SVG/PNG/JSX |

## API pluginów i skryptowanie

| Funkcja | Status | Uwagi |
|---------|--------|-------|
| Komenda eval z Figma Plugin API | ✅ | Headless wykonywanie JavaScript z globalnym obiektem figma kompatybilnym |

## Współpraca i tryb deweloperski

| Funkcja | Status | Uwagi |
|---------|--------|-------|
| Komentarze (przypinanie, wątki, rozwiązywanie) | 🔲 | Planowane na Fazę 6 |
| Multiplayer w czasie rzeczywistym | ✅ | P2P przez Trystero + Yjs CRDT, kursory, tryb śledzenia; bez serwera |
| Chat przy kursorze | 🔲 | Bąbelki czatu inline przy kursorze |
| Branching i merging | 🔲 | Gałęzie wersji dla plików projektowych |
| Tryb deweloperski (inspekcja) | 🟡 | Karta Kod pokazuje JSX; brak właściwości CSS ani specyfikacji handoff |
| Code Connect | 🔲 | Łączenie komponentów projektowych z kodem |
| Fragmenty kodu | 🟡 | Eksport JSX z podświetlaniem i kopiowaniem; brak fragmentów CSS/Swift/Kotlin |
| Figma for VS Code | 🔲 | Integracja z pluginem edytora |
| Serwer MCP | ✅ | @open-pencil/mcp z transportami stdio i HTTP oraz ponad 90 narzędziami, w tym operacjami na plikach |
| Narzędzia CLI | ✅ | Headless CLI: info, tree, find, export, analyze, node, pages, variables, eval; serwer MCP |

## Figma Draw

| Funkcja | Status | Uwagi |
|---------|--------|-------|
| Narzędzia ilustracji | 🔲 | Specjalistyczne narzędzia rysowania Figma Draw |
| Transformacje wzorów | 🔲 | Tworzenie powtarzających się wzorów z transformacjami |