Natywne wykończenie od razu
Skale typografii compact i regular dopasowane do iOS i Androida. Aurora korzysta ze Space Grotesk, Bloom łączy Outfit z Plus Jakarta Sans, możesz też użyć dowolnej czcionki, którą ładujesz.
Co nowego w 2.0 MIT · React Native · v2.0.0
Buduj produkty, które wyglądają
natywnie domyślnie.
Native-UI to cross-platformowy design system dla React Native autorstwa POLPROG. Dostarcza natywne w odczuciu komponenty na iOS i Androida z produkcyjnym wykończeniem od pierwszego renderu.
Działa na
- iOS 15.1+
- Android 7+
- React Native 0.84+
- Reanimated 4
- Gotowe na New Architecture
51
Komponenty i prymitywy
1022
Zielone testy jednostkowe
100%
Strict TypeScript
2
Presety gęstości
Dlaczego Native-UI
Wszystko, czego potrzebuje zespół
aby wypuścić dopracowaną aplikację.
Opiniowane domyślne wartości. Nieopiniowane API. Zero-config wizualna spójność: natywnie na iOS, natywnie na Androidzie.
51 produkcyjnych komponentów
41 komponentów i 10 prymitywów pokrywających każdą powierzchnię ekranu: przyciski, pola, wybór dat, arkusze, toasty, wiersze list, skeletony i więcej.
Design tokens sterujące motywem
Jeden typowany system tokenów dla kolorów, typografii, spacingu, zaokrągleń i elewacji, plus tokeny dla każdego komponentu. Zmieniaj wariant motywu, akcent czy gęstość bez dotykania kodu komponentów.
Presety gęstości typograficznej
Skale compact (domyślna) i regular, każda po 18 wariantów, w tym z cyframi tabelarycznymi, z gotowymi wysokościami wiersza i wagami.
Dostępność wbudowana
Kolory tekstu spełniają wymagania kontrastu WCAG AA na każdej powierzchni, czytniki ekranu dostają role, etykiety i komunikaty, a ograniczenie ruchu jest domyślnie respektowane.
iOS i Android, jedno API
Haptyka, safe area, obsługa klawiatury i okna dialogowe działają zgodnie z każdą platformą za jednym interfejsem propsów. Każdą etykietę można zlokalizować, a ikony odbijają się w układach od prawej do lewej.
1022 testów jednostkowych, ścisłe typy
TypeScript strict i zestaw testów Jest przy każdej zmianie, a każde story w Storybooku jest testowane w motywie jasnym, ciemnym, od prawej do lewej i o wysokim kontraście.
Tree-shakeable i lekki
Publikowany jako ESM i CJS, bez efektów ubocznych, z osobnym eksportem dla każdego komponentu. Wysyłasz tylko to, co importują Twoje ekrany.
Komponenty
51 elementów. Jeden język wizualny.
Każda powierzchnia, której potrzebuje produkt, złożona z tego samego motywu, tokenów i systemu animacji.
Motyw podglądu
Przyciski
Chipsy
Dziś
Tydzień
Miesiąc
Własny
Pole tekstowe
Plakietki i Awatary
AM
NU
Nowe
3
Skeleton
Toast
Zmiany zostały zapisane.
Karta
Budżet miesięczny
3
Przełącznik
Powiadomienia
Cotygodniowy skrót
Lista
Profil
Jan Kowalski
Język
Polski
Kontrolka segmentowa
Dzień
Tydzień
Miesiąc
Wybór daty
Termin
12 lis 2026
Kafelek statystyki
Wydane w tym miesiącu
2 450 zł
12% poniżej budżetu
Kafelki akcji
Skanuj
Wyślij
Podziel
Postęp
0%
Piaskownica przycisku
Typografia
Skala typograficzna dla aplikacji.
18 wariantów z dostrojonymi rozmiarami, wysokościami wiersza i wagami. Pokazujemy tu skalę regular w rozmiarach iOS. Domyślna jest skala compact, stworzona dla ekranów bogatych w treść.
Natywnie domyślnie
Design system, dostarczony
Tytuł sekcji
Podsekcja
Nagłówek karty
Wyróżniony tekst treści
Treść: domyślny rozmiar czytania używany w całym design systemie.
Podtytuł używany do podtytułów list i tekstu drugorzędnego.
Etykieta formularza
OVERLINE SEKCJI
Design tokens
Jedno źródło prawdy dla każdego piksela.
Kolory, spacing, zaokrąglenia i elewacja: otypowane, z motywem i dostępne dla każdego komponentu.
Kolory
Spacing
2xs
2px
xs
4px
sm
8px
smPlus
12px
md
16px
mdPlus
20px
lg
24px
xl
32px
2xl
40px
3xl
56px
Zaokrąglenia
xs
6px
sm
10px
md
14px
lg
18px
xl
24px
2xl
32px
full
9999px
Instalacja
Wypuść pierwszy ekran
w niespełna minutę.
Wrzuć providera, zaimportuj komponenty, gotowe. Żadnej konfiguracji, pisania motywów ani żonglowania tokenami.
App.tsx
import { NativeUIProvider, Button, Card, Heading, VStack } from '@polprog/native-ui';
export default function App() {
return (
<NativeUIProvider>
<Card>
<VStack gap="lg">
<Heading level={1}>Welcome</Heading>
<Button title="Get started" onPress={handlePress} />
</VStack>
</Card>
</NativeUIProvider>
);
}Różnica
Czysty React Native vs. Native-UI
| Zagadnienie | Czysty React Native | Native-UI |
|---|---|---|
| Skala typografii | DIY na każdym ekranie | 18 wstępnie dostrojonych wariantów · 2 presety gęstości |
| Design tokens | Ręczne stałe w StyleSheet | Silnie otypowany motyw · zmiana w jednej linii |
| Dostępność | Opt-in na każdym komponencie | Role · etykiety · komunikaty · kontrast tekstu AA domyślnie |
| Spójność platform | Platform.select rozsiany wszędzie | Zunifikowane propsy, zachowania platform ukryte |
| Formularze i pola | Sam budujesz label / helper / error | Input, TextArea, Select, wybór dat, Checkbox, Radio, Switch gotowe |
| Animacje i haptyka | Osobna instalacja i podłączanie | PressableScale, Toast, Confetti, Skeleton wbudowane |
| Spójność wizualna | Rozjeżdża się między ekranami / zespołami | Produkcyjna spójność wymuszona przez tokeny |
| Siatka bezpieczeństwa testów | Twoja odpowiedzialność | 1022 testów jednostkowych w paczce |
W produkcji
Działa w prawdziwych aplikacjach
Aplikacje POLPROG w App Store i Google Play, zbudowane na tych samych komponentach i tokenach co ta strona.
CostBoard
Budżet domowy i budżety remontów, wyceny PDF prosto z telefonu
Prowadzi budżet domowy i budżety remontów jako osobne projekty, a wykonawcom pozwala wysłać klientowi wycenę PDF prosto z telefonu. Działa offline i bez zakładania konta.
- App Store
- Google Play
- Offline-first
- Bez konta
PhotoToPuzzle
Zamień dowolne zdjęcie w puzzle, bez utraty prywatności
Dbająca o prywatność gra w puzzle ze zdjęć na telefony i tablety. Native-UI napędza jej przyciski, karty, modale, tokeny motywu i adaptacyjne układy, a zdjęcia nigdy nie opuszczają urządzenia.
- App Store
- Google Play
- Telefon + tablet
- Offline-first
Gotowy(-a) wypuścić coś, co wygląda natywnie?
Zainstaluj Native-UI i poświęć czas produktowi, nie pikselom.