Design system Apple

apple.com
PROSilnik v4

Tokeny projektowe wyodrębnione z analizy częstotliwości CSSOM bez interpretacji przez LLM.

System wizualny
100% pewność
98% pewność
hero-displayDesign is intelligence made visibleSF Pro Display80px / 600 / 1.05
display-xlDesign is intelligence made visibleSF Pro Display64px / 600 / 1.05
display-lgDesign is intelligence made visibleSF Pro Display56px / 600 / 1.05
display-mdDesign is intelligence made visibleSF Pro Display48px / 600 / 1.1
title-lgDesign is intelligence made visibleSF Pro Text34px / 600 / 1.45
title-mdDesign is intelligence made visibleSF Pro Display28px / 600 / 1.15
subtitleDesign is intelligence made visibleSF Pro Display21px / 400 / 1.2
leadDesign is intelligence made visibleSF Pro Display21px / 400 / 1.4
bodyDesign is intelligence made visibleSF Pro Text17px / 400 / 1.45
body-strongDesign is intelligence made visibleSF Pro Text17px / 600 / 1.45
body-boldDesign is intelligence made visibleSF Pro Text17px / 700 / 1.45
buttonDesign is intelligence made visibleSF Pro Text17px / 400 / 1.2
link-strongDesign is intelligence made visibleSF Pro Text17px / 600 / 1.25
body-smDesign is intelligence made visibleSF Pro Text14px / 400 / 1.3
captionDesign is intelligence made visibleSF Pro Text12px / 400 / 1.35
caption-strongDesign is intelligence made visibleSF Pro Text12px / 600 / 1.35
nav-linkDesign is intelligence made visibleSF Pro Text12px / 400 / 1
100% pewność
button-secondary-2-padding-y
8px
button-primary-padding-y
11px
button-secondary-padding-y
11px
button-ghost-padding-y
11px
button-secondary-2-padding-x
15px
button-primary-padding-x
21px
button-secondary-padding-x
21px
button-ghost-padding-x
21px
100% pewność
xs · 8px
sm · 10px
md · 11px
lg · 14px
xl · 18px
2xl · 20px
3xl · 48px
4xl · 56px
pill · 980px
full · 9999px

Komponenty

Buttons12

100% zgodność

ghost · desktop

SpoczynekZgodność 100%Zgodne pomiary: 26

Oryginał
Oryginalny Button, ghost na stronie, spoczynek
Render
Osobny render: Button, ghost, spoczynek

HoverZgodność 100%Zgodne pomiary: 22

Oryginał
Oryginalny Button, ghost na stronie, hover
Render
Osobny render: Button, ghost, hover

FocusZgodność 100%Zgodne pomiary: 22

Oryginał
Oryginalny Button, ghost na stronie, focus
Render
Osobny render: Button, ghost, focus
Receptura w DESIGN.md

100% zgodność

ghost · desktop

SpoczynekZgodność 100%Zgodne pomiary: 22

Oryginał
Oryginalny Button, ghost (2) na stronie, spoczynek
Render
Osobny render: Button, ghost (2), spoczynek

FocusZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Button, ghost (2) na stronie, focus
Render
Osobny render: Button, ghost (2), focus
Receptura w DESIGN.md

100% zgodność

ghost · desktop

Label y: 59px, na stronie 0px.

SpoczynekZgodność 100%Różne pomiary: 1 z 57

Oryginał
Oryginalny Button, ghost (3) na stronie, spoczynek
Render
Osobny render: Button, ghost (3), spoczynek

HoverZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Button, ghost (3) na stronie, hover
Render
Osobny render: Button, ghost (3), hover

FocusZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Button, ghost (3) na stronie, focus
Render
Osobny render: Button, ghost (3), focus
Receptura w DESIGN.md

Nie do sprawdzenia

ghost · desktop

Nie do sprawdzenia: zdjęcia, multimedia lub reklamy umieszczone w nim przez stronę zakrywają większość elementu, a poza tym nic się nie różni, więc porównanie nic nie mówi o recepturze.

SpoczynekZgodność 100%Zgodne pomiary: 35

Oryginał
Oryginalny Button, ghost (4) na stronie, spoczynek
Render
Osobny render: Button, ghost (4), spoczynek

FocusZgodność 61%Zgodne pomiary: 18

Oryginał
Oryginalny Button, ghost (4) na stronie, focus
Render
Osobny render: Button, ghost (4), focus
Receptura w DESIGN.md

100% zgodność

primary · desktop

SpoczynekZgodność 100%Zgodne pomiary: 26

Oryginał
Oryginalny Button, primary na stronie, spoczynek
Render
Osobny render: Button, primary, spoczynek

HoverZgodność 100%Zgodne pomiary: 22

Oryginał
Oryginalny Button, primary na stronie, hover
Render
Osobny render: Button, primary, hover

FocusZgodność 100%Zgodne pomiary: 22

Oryginał
Oryginalny Button, primary na stronie, focus
Render
Osobny render: Button, primary, focus
Receptura w DESIGN.md

76% zgodność

primary · desktop

Label 2 y: 27px, na stronie 9px.

SpoczynekZgodność 100%Różne pomiary: 1 z 29

Oryginał
Oryginalny Button, primary (2) na stronie, spoczynek
Render
Osobny render: Button, primary (2), spoczynek

HoverZgodność 91%Zgodne pomiary: 22

Oryginał
Oryginalny Button, primary (2) na stronie, hover
Render
Osobny render: Button, primary (2), hover

FocusZgodność 76%Zgodne pomiary: 22

Oryginał
Oryginalny Button, primary (2) na stronie, focus
Render
Osobny render: Button, primary (2), focus
Receptura w DESIGN.md

76% zgodność

primary · desktop

Group y: 27px, na stronie 9px; Label 2 y: 28px, na stronie 10px i jeszcze 2.

SpoczynekZgodność 100%Różne pomiary: 4 z 55

Oryginał
Oryginalny Button, primary (3) na stronie, spoczynek
Render
Osobny render: Button, primary (3), spoczynek

HoverZgodność 91%Zgodne pomiary: 22

Oryginał
Oryginalny Button, primary (3) na stronie, hover
Render
Osobny render: Button, primary (3), hover

FocusZgodność 76%Zgodne pomiary: 22

Oryginał
Oryginalny Button, primary (3) na stronie, focus
Render
Osobny render: Button, primary (3), focus
Receptura w DESIGN.md

94% zgodność

primary · desktop

Zgodność renderu ze stroną to 95%, poniżej progu 97%.

SpoczynekZgodność 95%Zgodne pomiary: 25

Oryginał
Oryginalny Button, primary (4) na stronie, spoczynek
Render
Osobny render: Button, primary (4), spoczynek

HoverZgodność 95%Zgodne pomiary: 22

Oryginał
Oryginalny Button, primary (4) na stronie, hover
Render
Osobny render: Button, primary (4), hover

FocusZgodność 94%Zgodne pomiary: 22

Oryginał
Oryginalny Button, primary (4) na stronie, focus
Render
Osobny render: Button, primary (4), focus
Receptura w DESIGN.md

94% zgodność

primary · desktop

Zgodność renderu ze stroną to 96%, poniżej progu 97%.

SpoczynekZgodność 96%Zgodne pomiary: 25

Oryginał
Oryginalny Button, primary (5) na stronie, spoczynek
Render
Osobny render: Button, primary (5), spoczynek

HoverZgodność 96%Zgodne pomiary: 22

Oryginał
Oryginalny Button, primary (5) na stronie, hover
Render
Osobny render: Button, primary (5), hover

FocusZgodność 94%Zgodne pomiary: 22

Oryginał
Oryginalny Button, primary (5) na stronie, focus
Render
Osobny render: Button, primary (5), focus
Receptura w DESIGN.md

99% zgodność

secondary · desktop

SpoczynekZgodność 100%Zgodne pomiary: 26

Oryginał
Oryginalny Button, secondary na stronie, spoczynek
Render
Osobny render: Button, secondary, spoczynek

HoverZgodność 100%Zgodne pomiary: 22

Oryginał
Oryginalny Button, secondary na stronie, hover
Render
Osobny render: Button, secondary, hover

FocusZgodność 99%Zgodne pomiary: 22

Oryginał
Oryginalny Button, secondary na stronie, focus
Render
Osobny render: Button, secondary, focus
Receptura w DESIGN.md

100% zgodność

secondary · desktop

SpoczynekZgodność 100%Zgodne pomiary: 26

Oryginał
Oryginalny Button, secondary (2) na stronie, spoczynek
Render
Osobny render: Button, secondary (2), spoczynek

HoverZgodność 100%Zgodne pomiary: 22

Oryginał
Oryginalny Button, secondary (2) na stronie, hover
Render
Osobny render: Button, secondary (2), hover

FocusZgodność 100%Zgodne pomiary: 22

Oryginał
Oryginalny Button, secondary (2) na stronie, focus
Render
Osobny render: Button, secondary (2), focus
Receptura w DESIGN.md

97% zgodność

secondary · desktop

Element główny width: 138px, na stronie 202px; Element główny height: 64px, na stronie 92px.

SpoczynekZgodność 97%Różne pomiary: 2 z 22

Oryginał
Oryginalny Button, secondary (3) na stronie, spoczynek
Render
Osobny render: Button, secondary (3), spoczynek

HoverZgodność 97%Zgodne pomiary: 18

Oryginał
Oryginalny Button, secondary (3) na stronie, hover
Render
Osobny render: Button, secondary (3), hover

FocusZgodność 97%Zgodne pomiary: 18

Oryginał
Oryginalny Button, secondary (3) na stronie, focus
Render
Osobny render: Button, secondary (3), focus
Receptura w DESIGN.md

Input1

89% zgodność

desktop

Przy focus, zgodność renderu ze stroną to 89%, poniżej progu 97%.

SpoczynekZgodność 99%Zgodne pomiary: 90

Oryginał
Oryginalny Input na stronie, spoczynek
Render
Osobny render: Input, spoczynek

FocusZgodność 89%Zgodne pomiary: 22

Oryginał
Oryginalny Input na stronie, focus
Render
Osobny render: Input, focus
Receptura w DESIGN.md

Cards9

100% zgodność

desktop

Media y: 93px, na stronie 57px; Text y: 149px, na stronie 106px i jeszcze 3.

SpoczynekZgodność 100%Różne pomiary: 5 z 201

Oryginał
Oryginalny Card na stronie, spoczynek
Render
Osobny render: Card, spoczynek

HoverZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Card na stronie, hover
Render
Osobny render: Card, hover

FocusZgodność 100%Różne pomiary: 1 z 18

Oryginał
Oryginalny Card na stronie, focus
Render
Osobny render: Card, focus

Spoczynek, wystąpienie 2Zgodność 100%Różne pomiary: 5 z 201

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 3Zgodność 100%Różne pomiary: 5 z 201

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 4Zgodność 100%Różne pomiary: 5 z 201

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 5Zgodność 100%Różne pomiary: 5 z 201

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 6Zgodność 100%Różne pomiary: 5 z 201

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

100% zgodność

desktop

Break y: 110px, na stronie 138px; Text y: 138px, na stronie 166px.

SpoczynekZgodność 100%Różne pomiary: 2 z 73

Oryginał
Oryginalny Card (2) na stronie, spoczynek
Render
Osobny render: Card (2), spoczynek

HoverZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Card (2) na stronie, hover
Render
Osobny render: Card (2), hover

FocusZgodność 100%Różne pomiary: 1 z 18

Oryginał
Oryginalny Card (2) na stronie, focus
Render
Osobny render: Card (2), focus

Spoczynek, wystąpienie 2Zgodność 100%Różne pomiary: 2 z 73

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 3Zgodność 100%Różne pomiary: 2 z 73

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

100% zgodność

desktop

Group y: 0px, na stronie 77px; Media y: 0px, na stronie 77px i jeszcze 14.

SpoczynekZgodność 100%Różne pomiary: 16 z 190

Oryginał
Oryginalny Card (3) na stronie, spoczynek
Render
Osobny render: Card (3), spoczynek

HoverZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Card (3) na stronie, hover
Render
Osobny render: Card (3), hover

FocusZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Card (3) na stronie, focus
Render
Osobny render: Card (3), focus

Spoczynek, wystąpienie 2Zgodność 100%Różne pomiary: 16 z 190

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 3Zgodność 100%Różne pomiary: 16 z 190

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 4Zgodność 100%Różne pomiary: 16 z 190

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 5Zgodność 100%Różne pomiary: 16 z 190

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 6Zgodność 100%Różne pomiary: 16 z 190

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

99% zgodność

desktop

SpoczynekZgodność 99%Zgodne pomiary: 154

Oryginał
Oryginalny Card (4) na stronie, spoczynek
Render
Osobny render: Card (4), spoczynek

Spoczynek, wystąpienie 2Zgodność 99%Zgodne pomiary: 154

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 3Zgodność 99%Zgodne pomiary: 154

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 4Zgodność 100%Zgodne pomiary: 154

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

Nie do sprawdzenia

desktop

Nie do sprawdzenia: zdjęcia, multimedia lub reklamy umieszczone w nim przez stronę zakrywają większość elementu, a poza tym nic się nie różni, więc porównanie nic nie mówi o recepturze.

SpoczynekZgodność 100%Zgodne pomiary: 66

Oryginał
Oryginalny Card (5) na stronie, spoczynek
Render
Osobny render: Card (5), spoczynek

Spoczynek, wystąpienie 2Zgodność 100%Zgodne pomiary: 66

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 3Zgodność 100%Zgodne pomiary: 66

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

Nie do sprawdzenia

desktop

Nie do sprawdzenia: zdjęcia, multimedia lub reklamy umieszczone w nim przez stronę zakrywają większość elementu, a poza tym nic się nie różni, więc porównanie nic nie mówi o recepturze.

SpoczynekZgodność 100%Zgodne pomiary: 149

Oryginał
Oryginalny Card (6) na stronie, spoczynek
Render
Osobny render: Card (6), spoczynek

Spoczynek, wystąpienie 2Zgodność 100%Zgodne pomiary: 149

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 3Zgodność 100%Zgodne pomiary: 149

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 4Zgodność 100%Zgodne pomiary: 149

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 5Zgodność 100%Zgodne pomiary: 149

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

Nie do sprawdzenia

desktop

Nie do sprawdzenia: zdjęcia, multimedia lub reklamy umieszczone w nim przez stronę zakrywają większość elementu, a poza tym nic się nie różni, więc porównanie nic nie mówi o recepturze.

SpoczynekZgodność 100%Zgodne pomiary: 63

Oryginał
Oryginalny Card (7) na stronie, spoczynek
Render
Osobny render: Card (7), spoczynek

Spoczynek, wystąpienie 2Zgodność 100%Zgodne pomiary: 63

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 3Zgodność 100%Zgodne pomiary: 63

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

100% zgodność

desktop

SpoczynekZgodność 100%Zgodne pomiary: 119

Oryginał
Oryginalny Card (8) na stronie, spoczynek
Render
Osobny render: Card (8), spoczynek

Spoczynek, wystąpienie 2Zgodność 100%Zgodne pomiary: 119

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 3Zgodność 100%Zgodne pomiary: 119

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

95% zgodność

desktop

Title y: 5px, na stronie 124px; Body y: 123px, na stronie 241px i jeszcze 2.

SpoczynekZgodność 95%Różne pomiary: 4 z 111

Oryginał
Oryginalny Card (9) na stronie, spoczynek
Render
Osobny render: Card (9), spoczynek

Spoczynek, wystąpienie 2Zgodność 100%Różne pomiary: 4 z 111

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 3Zgodność 100%Różne pomiary: 4 z 111

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

Extras26

100% zgodność

desktop

Element główny height: 78px, na stronie 56px; Group 2 height: 44px, na stronie 22px i jeszcze 2.

SpoczynekZgodność 100%Różne pomiary: 4 z 109

Oryginał
Oryginalny Breadcrumbs na stronie, spoczynek
Render
Osobny render: Breadcrumbs, spoczynek
Receptura w DESIGN.md

91% zgodność

desktop

Przy focus, zgodność renderu ze stroną to 91%, poniżej progu 96%.

SpoczynekZgodność 100%Zgodne pomiary: 21

Oryginał
Oryginalny Card links na stronie, spoczynek
Render
Osobny render: Card links, spoczynek

FocusZgodność 91%Zgodne pomiary: 18

Oryginał
Oryginalny Card links na stronie, focus
Render
Osobny render: Card links, focus
Receptura w DESIGN.md

93% zgodność

desktop

Group 2 y: 87px, na stronie 98px; Text y: 87px, na stronie 98px.

SpoczynekZgodność 100%Różne pomiary: 2 z 67

Oryginał
Oryginalny Card links (2) na stronie, spoczynek
Render
Osobny render: Card links (2), spoczynek

FocusZgodność 93%Zgodne pomiary: 18

Oryginał
Oryginalny Card links (2) na stronie, focus
Render
Osobny render: Card links (2), focus
Receptura w DESIGN.md

88% zgodność

desktop

Przy focus, zgodność renderu ze stroną to 88%, poniżej progu 96%.

SpoczynekZgodność 100%Zgodne pomiary: 23

Oryginał
Oryginalny Card links (3) na stronie, spoczynek
Render
Osobny render: Card links (3), spoczynek

FocusZgodność 88%Zgodne pomiary: 18

Oryginał
Oryginalny Card links (3) na stronie, focus
Render
Osobny render: Card links (3), focus
Receptura w DESIGN.md

Nie do sprawdzenia

desktop

Nie do sprawdzenia: zdjęcia, multimedia lub reklamy umieszczone w nim przez stronę zakrywają większość elementu, a poza tym nic się nie różni, więc porównanie nic nie mówi o recepturze.

SpoczynekZgodność 99%Zgodne pomiary: 149

Oryginał
Oryginalny Carousel section na stronie, spoczynek
Render
Osobny render: Carousel section, spoczynek

Spoczynek, wystąpienie 2Zgodność 100%Zgodne pomiary: 149

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 3Zgodność 100%Zgodne pomiary: 149

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 4Zgodność 100%Zgodne pomiary: 149

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 5Zgodność 100%Zgodne pomiary: 149

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 6Zgodność 100%Zgodne pomiary: 149

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

100% zgodność

desktop

List width: 225px, na stronie 176px; Item width: 225px, na stronie 176px i jeszcze 31.

SpoczynekZgodność 100%Różne pomiary: 33 z 776

Oryginał
Oryginalny Footer links na stronie, spoczynek
Render
Osobny render: Footer links, spoczynek
Receptura w DESIGN.md

100% zgodność

desktop

SpoczynekZgodność 100%Zgodne pomiary: 56

Oryginał
Oryginalny Icon buttons na stronie, spoczynek
Render
Osobny render: Icon buttons, spoczynek

HoverZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Icon buttons na stronie, hover
Render
Osobny render: Icon buttons, hover

FocusZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Icon buttons na stronie, focus
Render
Osobny render: Icon buttons, focus
Receptura w DESIGN.md

100% zgodność

desktop

SpoczynekZgodność 100%Zgodne pomiary: 98

Oryginał
Oryginalny Icon buttons (2) na stronie, spoczynek
Render
Osobny render: Icon buttons (2), spoczynek

HoverZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Icon buttons (2) na stronie, hover
Render
Osobny render: Icon buttons (2), hover

FocusZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Icon buttons (2) na stronie, focus
Render
Osobny render: Icon buttons (2), focus
Receptura w DESIGN.md

100% zgodność

desktop

SpoczynekZgodność 100%Zgodne pomiary: 56

Oryginał
Oryginalny Icon link na stronie, spoczynek
Render
Osobny render: Icon link, spoczynek

HoverZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Icon link na stronie, hover
Render
Osobny render: Icon link, hover

FocusZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Icon link na stronie, focus
Render
Osobny render: Icon link, focus
Receptura w DESIGN.md

100% zgodność

desktop

SpoczynekZgodność 100%Zgodne pomiary: 98

Oryginał
Oryginalny Icon link (2) na stronie, spoczynek
Render
Osobny render: Icon link (2), spoczynek

HoverZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Icon link (2) na stronie, hover
Render
Osobny render: Icon link (2), hover

FocusZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Icon link (2) na stronie, focus
Render
Osobny render: Icon link (2), focus
Receptura w DESIGN.md

100% zgodność

desktop

List width: 225px, na stronie 176px; Item width: 225px, na stronie 176px i jeszcze 31.

SpoczynekZgodność 100%Różne pomiary: 33 z 776

Oryginał
Oryginalny Link list na stronie, spoczynek
Render
Osobny render: Link list, spoczynek
Receptura w DESIGN.md

100% zgodność

desktop

List width: 225px, na stronie 176px; Item width: 225px, na stronie 176px i jeszcze 31.

SpoczynekZgodność 100%Różne pomiary: 33 z 776

Oryginał
Oryginalny Nav links na stronie, spoczynek
Render
Osobny render: Nav links, spoczynek
Receptura w DESIGN.md

100% zgodność

desktop

SpoczynekZgodność 100%Zgodne pomiary: 22

Oryginał
Oryginalny Nav menu item na stronie, spoczynek
Render
Osobny render: Nav menu item, spoczynek

FocusZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Nav menu item na stronie, focus
Render
Osobny render: Nav menu item, focus
Receptura w DESIGN.md

100% zgodność

desktop

SpoczynekZgodność 100%Zgodne pomiary: 22

Oryginał
Oryginalny Navigation links na stronie, spoczynek
Render
Osobny render: Navigation links, spoczynek

FocusZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Navigation links na stronie, focus
Render
Osobny render: Navigation links, focus
Receptura w DESIGN.md

100% zgodność

desktop

SpoczynekZgodność 100%Zgodne pomiary: 22

Oryginał
Oryginalny Navigation menu item na stronie, spoczynek
Render
Osobny render: Navigation menu item, spoczynek

FocusZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Navigation menu item na stronie, focus
Render
Osobny render: Navigation menu item, focus
Receptura w DESIGN.md

50% zgodność

desktop

Zgodność renderu ze stroną to 50%, poniżej progu 96%.

SpoczynekZgodność 50%Zgodne pomiary: 192

Oryginał
Oryginalny Promo banner na stronie, spoczynek
Render
Osobny render: Promo banner, spoczynek

HoverZgodność 50%Zgodne pomiary: 18

Oryginał
Oryginalny Promo banner na stronie, hover
Render
Osobny render: Promo banner, hover

FocusZgodność 50%Różne pomiary: 1 z 18

Oryginał
Oryginalny Promo banner na stronie, focus
Render
Osobny render: Promo banner, focus

Spoczynek, wystąpienie 2Zgodność 100%Zgodne pomiary: 192

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 3Zgodność 100%Zgodne pomiary: 192

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

100% zgodność

desktop

Group y: 8px, na stronie 12px; Group width: 1180px, na stronie 1154px i jeszcze 30.

SpoczynekZgodność 100%Różne pomiary: 32 z 374

Oryginał
Oryginalny Sub navigation na stronie, spoczynek
Render
Osobny render: Sub navigation, spoczynek
Receptura w DESIGN.md

99% zgodność

desktop

SpoczynekZgodność 99%Zgodne pomiary: 91

Oryginał
Oryginalny Tabs na stronie, spoczynek
Render
Osobny render: Tabs, spoczynek

HoverZgodność 99%Zgodne pomiary: 19

Oryginał
Oryginalny Tabs na stronie, hover
Render
Osobny render: Tabs, hover

FocusZgodność 99%Zgodne pomiary: 19

Oryginał
Oryginalny Tabs na stronie, focus
Render
Osobny render: Tabs, focus

Spoczynek, wystąpienie 2Zgodność 100%Zgodne pomiary: 91

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 3Zgodność 100%Zgodne pomiary: 91

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 4Zgodność 100%Zgodne pomiary: 91

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 5Zgodność 100%Zgodne pomiary: 91

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Spoczynek, wystąpienie 6Zgodność 100%Zgodne pomiary: 91

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

100% zgodność

desktop

SpoczynekZgodność 100%Zgodne pomiary: 77

Oryginał
Oryginalny Tabs (2) na stronie, spoczynek
Render
Osobny render: Tabs (2), spoczynek

HoverZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Tabs (2) na stronie, hover
Render
Osobny render: Tabs (2), hover

FocusZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Tabs (2) na stronie, focus
Render
Osobny render: Tabs (2), focus
Receptura w DESIGN.md

100% zgodność

desktop

SpoczynekZgodność 100%Zgodne pomiary: 77

Oryginał
Oryginalny Tabs (3) na stronie, spoczynek
Render
Osobny render: Tabs (3), spoczynek

HoverZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Tabs (3) na stronie, hover
Render
Osobny render: Tabs (3), hover

FocusZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Tabs (3) na stronie, focus
Render
Osobny render: Tabs (3), focus
Receptura w DESIGN.md

100% zgodność

desktop

Group y: 8px, na stronie 12px; Group height: 43px, na stronie 36px i jeszcze 32.

SpoczynekZgodność 100%Różne pomiary: 34 z 418

Oryginał
Oryginalny Tab bar na stronie, spoczynek
Render
Osobny render: Tab bar, spoczynek
Receptura w DESIGN.md

100% zgodność

desktop

Text 2 y: 33px, na stronie 17px; Group width: 0px, na stronie 4px.

SpoczynekZgodność 100%Różne pomiary: 2 z 234

Oryginał
Oryginalny Table na stronie, spoczynek
Render
Osobny render: Table, spoczynek
Receptura w DESIGN.md

97% zgodność

desktop

Element główny height: 105px, na stronie 96px; Text height: 74px, na stronie 65px i jeszcze 7.

SpoczynekZgodność 100%Różne pomiary: 9 z 72

Oryginał
Oryginalny Text link na stronie, spoczynek
Render
Osobny render: Text link, spoczynek

FocusZgodność 97%Zgodne pomiary: 18

Oryginał
Oryginalny Text link na stronie, focus
Render
Osobny render: Text link, focus
Receptura w DESIGN.md

100% zgodność

desktop

Group 3 y: 55px, na stronie 66px; Text y: 55px, na stronie 66px.

SpoczynekZgodność 100%Różne pomiary: 2 z 87

Oryginał
Oryginalny Text link (2) na stronie, spoczynek
Render
Osobny render: Text link (2), spoczynek

FocusZgodność 100%Zgodne pomiary: 18

Oryginał
Oryginalny Text link (2) na stronie, focus
Render
Osobny render: Text link (2), focus
Receptura w DESIGN.md

35% zgodność

desktop

Przy focus, zgodność renderu ze stroną to 35%, poniżej progu 96%.

SpoczynekZgodność 100%Zgodne pomiary: 21

Oryginał
Oryginalny Text link (3) na stronie, spoczynek
Render
Osobny render: Text link (3), spoczynek

FocusZgodność 35%Zgodne pomiary: 18

Oryginał
Oryginalny Text link (3) na stronie, focus
Render
Osobny render: Text link (3), focus
Receptura w DESIGN.md

74% zgodność

desktop

Element główny width: 138px, na stronie 202px; Element główny height: 64px, na stronie 92px.

SpoczynekZgodność 74%Różne pomiary: 2 z 22

Oryginał
Oryginalny Toggle button na stronie, spoczynek
Render
Osobny render: Toggle button, spoczynek

FocusZgodność 74%Zgodne pomiary: 18

Oryginał
Oryginalny Toggle button na stronie, focus
Render
Osobny render: Toggle button, focus
Receptura w DESIGN.md

Headers8

100% zgodność

desktop

Group x: 713px, na stronie 1146px; Icon 2 x: 713px, na stronie 1146px.

SpoczynekZgodność 100%Różne pomiary: 2 z 308

Oryginał
Oryginalny Header (inner) na stronie, spoczynek
Render
Osobny render: Header (inner), spoczynek

Hoverniesprawdzony

Oryginał
Oryginalny Header (inner) na stronie, hover
Render
Osobny render: Header (inner), hover

Focusniesprawdzony

Oryginał
Oryginalny Header (inner) na stronie, focus
Render
Osobny render: Header (inner), focus

Focus na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav link 3Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 3Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

100% zgodność

desktop

Group x: 713px, na stronie 1146px; Icon 2 x: 713px, na stronie 1146px.

SpoczynekZgodność 100%Różne pomiary: 2 z 308

Oryginał
Oryginalny Header (inner, 2) na stronie, spoczynek
Render
Osobny render: Header (inner, 2), spoczynek

Hoverniesprawdzony

Oryginał
Oryginalny Header (inner, 2) na stronie, hover
Render
Osobny render: Header (inner, 2), hover

Focusniesprawdzony

Oryginał
Oryginalny Header (inner, 2) na stronie, focus
Render
Osobny render: Header (inner, 2), focus

Focus na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav link 3Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 3Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

94% zgodność

desktop

Group 4 y: 52px, na stronie -3px; Group 4 height: 59px, na stronie 41px i jeszcze 5.

SpoczynekZgodność 98%Różne pomiary: 7 z 228

Oryginał
Oryginalny Header (inner, 3) na stronie, spoczynek
Render
Osobny render: Header (inner, 3), spoczynek

Hoverniesprawdzony

Oryginał
Oryginalny Header (inner, 3) na stronie, hover
Render
Osobny render: Header (inner, 3), hover

Focusniesprawdzony

Oryginał
Oryginalny Header (inner, 3) na stronie, focus
Render
Osobny render: Header (inner, 3), focus

Focus na ctaZgodność 97%Zgodne pomiary: 22

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na ctaZgodność 98%Zgodne pomiary: 22

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na logoZgodność 94%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

100% zgodność

desktop

Group x: 713px, na stronie 1146px; Icon 2 x: 713px, na stronie 1146px.

SpoczynekZgodność 100%Różne pomiary: 2 z 308

Oryginał
Oryginalny Header (landing) na stronie, spoczynek
Render
Osobny render: Header (landing), spoczynek

Hoverniesprawdzony

Oryginał
Oryginalny Header (landing) na stronie, hover
Render
Osobny render: Header (landing), hover

Focusniesprawdzony

Oryginał
Oryginalny Header (landing) na stronie, focus
Render
Osobny render: Header (landing), focus

Focus na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav link 3Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 3Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

99% zgodność

mobile

Nav link 2 x: 261px, na stronie 246px; Group x: 277px, na stronie 262px i jeszcze 2.

SpoczynekZgodność 100%Różne pomiary: 4 z 385

Oryginał
Oryginalny Header (inner, 2) na stronie, spoczynek
Render
Osobny render: Header (inner, 2), spoczynek

Hoverniesprawdzony

Oryginał
Oryginalny Header (inner, 2) na stronie, hover
Render
Osobny render: Header (inner, 2), hover

Focusniesprawdzony

Oryginał
Oryginalny Header (inner, 2) na stronie, focus
Render
Osobny render: Header (inner, 2), focus

Focus na menu toggleZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na menu toggleZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav link 2Zgodność 99%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav link 3Zgodność 99%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 3Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

94% zgodność

mobile

Przy focus, zgodność renderu ze stroną to 94%, poniżej progu 96%.

SpoczynekZgodność 100%Zgodne pomiary: 207

Oryginał
Oryginalny Header (inner, 3) na stronie, spoczynek
Render
Osobny render: Header (inner, 3), spoczynek

Hoverniesprawdzony

Oryginał
Oryginalny Header (inner, 3) na stronie, hover
Render
Osobny render: Header (inner, 3), hover

Focusniesprawdzony

Oryginał
Oryginalny Header (inner, 3) na stronie, focus
Render
Osobny render: Header (inner, 3), focus

Focus na ctaZgodność 100%Zgodne pomiary: 22

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na ctaZgodność 100%Zgodne pomiary: 22

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na logoZgodność 94%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

99% zgodność

mobile

Nav link 2 x: 261px, na stronie 246px; Group x: 277px, na stronie 262px i jeszcze 2.

SpoczynekZgodność 100%Różne pomiary: 4 z 385

Oryginał
Oryginalny Header (inner) na stronie, spoczynek
Render
Osobny render: Header (inner), spoczynek

Hoverniesprawdzony

Oryginał
Oryginalny Header (inner) na stronie, hover
Render
Osobny render: Header (inner), hover

Focusniesprawdzony

Oryginał
Oryginalny Header (inner) na stronie, focus
Render
Osobny render: Header (inner), focus

Focus na menu toggleZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na menu toggleZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav link 2Zgodność 99%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav link 3Zgodność 99%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 3Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

99% zgodność

mobile

Nav link 2 x: 261px, na stronie 246px; Group x: 277px, na stronie 262px i jeszcze 2.

SpoczynekZgodność 100%Różne pomiary: 4 z 385

Oryginał
Oryginalny Header (landing) na stronie, spoczynek
Render
Osobny render: Header (landing), spoczynek

Hoverniesprawdzony

Oryginał
Oryginalny Header (landing) na stronie, hover
Render
Osobny render: Header (landing), hover

Focusniesprawdzony

Oryginał
Oryginalny Header (landing) na stronie, focus
Render
Osobny render: Header (landing), focus

Focus na menu toggleZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na menu toggleZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav link 2Zgodność 99%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav link 3Zgodność 99%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 3Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

Footers10

98% zgodność

desktop

Inner height: 5418px, na stronie 7902px; Group height: 5418px, na stronie 7280px i jeszcze 5.

SpoczynekZgodność 100%Różne pomiary: 7 z 1504

Oryginał
Oryginalny Footer (inner) na stronie, spoczynek
Render
Osobny render: Footer (inner), spoczynek

Focusniesprawdzony

Oryginał
Oryginalny Footer (inner) na stronie, focus
Render
Osobny render: Footer (inner), focus

Focus na link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na linkZgodność 98%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

100% zgodność

desktop

Inner height: 1244px, na stronie 2174px; Group height: 727px, na stronie 1552px i jeszcze 122.

SpoczynekZgodność 100%Różne pomiary: 124 z 1804

Oryginał
Oryginalny Footer (inner, 2) na stronie, spoczynek
Render
Osobny render: Footer (inner, 2), spoczynek

Hoverniesprawdzony

Oryginał
Oryginalny Footer (inner, 2) na stronie, hover
Render
Osobny render: Footer (inner, 2), hover

Focusniesprawdzony

Oryginał
Oryginalny Footer (inner, 2) na stronie, focus
Render
Osobny render: Footer (inner, 2), focus

Focus na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

100% zgodność

desktop

Inner height: 838px, na stronie 1131px; Group height: 320px, na stronie 509px i jeszcze 115.

SpoczynekZgodność 100%Różne pomiary: 117 z 2107

Oryginał
Oryginalny Footer (inner, 3) na stronie, spoczynek
Render
Osobny render: Footer (inner, 3), spoczynek

Hoverniesprawdzony

Oryginał
Oryginalny Footer (inner, 3) na stronie, hover
Render
Osobny render: Footer (inner, 3), hover

Focusniesprawdzony

Oryginał
Oryginalny Footer (inner, 3) na stronie, focus
Render
Osobny render: Footer (inner, 3), focus

Focus na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

100% zgodność

desktop

Inner height: 647px, na stronie 773px; List height: 22px, na stronie 0px i jeszcze 2.

SpoczynekZgodność 100%Różne pomiary: 4 z 2124

Oryginał
Oryginalny Footer (inner, 4) na stronie, spoczynek
Render
Osobny render: Footer (inner, 4), spoczynek

Hoverniesprawdzony

Oryginał
Oryginalny Footer (inner, 4) na stronie, hover
Render
Osobny render: Footer (inner, 4), hover

Focusniesprawdzony

Oryginał
Oryginalny Footer (inner, 4) na stronie, focus
Render
Osobny render: Footer (inner, 4), focus

Focus na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav link 2Zgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

100% zgodność

desktop

Inner height: 870px, na stronie 996px; Group 4 height: 323px, na stronie 349px i jeszcze 2.

SpoczynekZgodność 100%Różne pomiary: 4 z 2214

Oryginał
Oryginalny Footer (landing) na stronie, spoczynek
Render
Osobny render: Footer (landing), spoczynek

Hoverniesprawdzony

Oryginał
Oryginalny Footer (landing) na stronie, hover
Render
Osobny render: Footer (landing), hover

Focusniesprawdzony

Oryginał
Oryginalny Footer (landing) na stronie, focus
Render
Osobny render: Footer (landing), focus

Focus na linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav linkZgodność 100%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

99% zgodność

mobile

Inner height: 2134px, na stronie 4222px; Group height: 1575px, na stronie 3584px i jeszcze 170.

SpoczynekZgodność 99%Różne pomiary: 172 z 1615

Oryginał
Oryginalny Footer (inner, 2) na stronie, spoczynek
Render
Osobny render: Footer (inner, 2), spoczynek

Hoverniesprawdzony

Oryginał
Oryginalny Footer (inner, 2) na stronie, hover
Render
Osobny render: Footer (inner, 2), hover

Focusniesprawdzony

Oryginał
Oryginalny Footer (inner, 2) na stronie, focus
Render
Osobny render: Footer (inner, 2), focus

Focus na buttonZgodność 99%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na buttonZgodność 99%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na nav linkZgodność 99%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na nav linkZgodność 99%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

Niesprawdzony

mobile

Nie udało się wyrenderować receptury osobno.

Dla tego komponentu nic nie zostało porównane.

Receptura w DESIGN.md

Niesprawdzony

mobile

Nie udało się wyrenderować receptury osobno.

Dla tego komponentu nic nie zostało porównane.

Receptura w DESIGN.md

Niesprawdzony

mobile

Nie udało się wyrenderować receptury osobno.

Dla tego komponentu nic nie zostało porównane.

Receptura w DESIGN.md

98% zgodność

mobile

Element główny height: 1554px, na stronie 1433px; Inner height: 1554px, na stronie 1433px i jeszcze 143.

SpoczynekZgodność 98%Różne pomiary: 145 z 1880

Oryginał
Oryginalny Footer (landing) na stronie, spoczynek
Render
Osobny render: Footer (landing), spoczynek

Hoverniesprawdzony

Oryginał
Oryginalny Footer (landing) na stronie, hover
Render
Osobny render: Footer (landing), hover

Focusniesprawdzony

Oryginał
Oryginalny Footer (landing) na stronie, focus
Render
Osobny render: Footer (landing), focus

Focus na buttonZgodność 98%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na buttonZgodność 98%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na link 2Zgodność 98%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na link 3Zgodność 98%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na link 3Zgodność 98%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na link 4Zgodność 98%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Hover na link 4Zgodność 98%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu

Focus na linkZgodność 98%Zgodne pomiary: 18

Oryginał
Brak zapisanego obrazu
Render
Brak zapisanego obrazu
Receptura w DESIGN.md

Wyodrębnione z publicznej strony Apple, to nie są oficjalne wytyczne marki. Sprawdź fonty innej strony

Podgląd strony Duolingo - The world’s most popular way to learn
Narzędzia na co dzień · Browser Extensions & Small Utilities

Duolingo - The world’s most popular way to learn

Tokeny projektowe wyodrębnione z analizy częstotliwości CSSOM bez interpretacji przez LLM.

Podgląd strony Airbnb
Podróże, transport i logistyka

Airbnb

Design system Airbnb opiera się na jednym zastrzeżonym zmiennym kroju pisma (Airbnb Cereal VF) i niemal monochromatycznej palecie neutralnych barw, z głębokim węglem (#222222) i jasnymi szarościami jako podstawą. Firmowy koral-róż „Rausch" (#ff385c) jest zarezerwowany wyłącznie dla głównych przycisków wezwania do działania i logo. Układ to responsywna siatka kart ze zdjęciami, z dużym udziałem obrazu w stosunku do tekstu, miękkimi, 20-pikselowymi zaokrągleniami rogów kart oraz wielowarstwowym systemem ambientowych cieni, który tworzy subtelną głębię bez ostrych kontrastów. Pasek wyszukiwania, w kształcie pigułki, jest wyraźnie wyeksponowany i łączy główną akcję użytkownika w jednym miejscu.

Podgląd strony IKEA
Handel i retail · E-commerce Store

IKEA

IKEA-owa globalna strona główna opiera się na odważnym, płaskim systemie projektowym, którego głównym elementem jest ikoniczny żółty IKEA (#ffdb00) jako powierzchnia najważniejszych działań, a niebieski IKEA (#0058a3) pełni rolę akcentu logo marki. Cały system typograficzny opiera się na jednym, autorskim kroju pisma – Noto IKEA – w wagach 400 i 700, w ściśle określonej skali, od 14px dla tekstu podstawowego po 51px dla nagłówków wyróżniających. Wyniesienie elementów nad tło osiągnięte jest wyłącznie dzięki kontrastowi barw i strukturze układu, bez cieni. Układ korzysta z kontenera o maksymalnej szerokości 90rem z odstępem siatki 1,5rem na desktopie oraz spójnego tokenu zaokrąglenia 8px stosowanego do elementów interaktywnych. Ciepłe, lekko kremowe tło (#fffefb) łagodzi surowość tekstu w kolorze #111111, tworząc czytelne, wysokokontrastowe i dostępne doświadczenie lektury.

Podgląd strony Notion
Oprogramowanie i SaaS · Productivity & Notes

Notion

Strona główna marketingowa Notion łączy głęboko granatową sekcję hero (#02093a) z jasnym tłem treści (#f6f5f4), stosując niestandardowy krój pisma NotionInter we wszystkich rolach tekstowych. Układ opiera się na siatce 12-kolumnowej z odstępami 28px, a język zaokrągleń łączy dwie wartości: 8px dla kart i 9999px dla pigułek. Elementy pływające otrzymują wielowarstwowy, stopniowo narastający system cieni. Niebieski marki (#2537b1) wyznacza przyciski wezwania do działania i akcenty, a semantyczna skala szarości (od gray-200 do gray-900) porządkuje hierarchię tekstu i powierzchni.

Podgląd strony Railway
Narzędzia deweloperskie i infrastruktura · Developer Tools & IDEs

Railway

Design system Railway to ciemne, nastawione na twórców platformy deweloperskiej. Opiera się na głęboko granatowo-czarnych powierzchniach (#13111c, #0b0b0f) i wysokokontrastowym, lekko kremowym tekście (#f7f7f8) oraz charakterystycznym fioletowym akcentem marki (#853bce / #553f83). Nagłówek sekcji hero używa kroju IBM Plex Serif, nadającego mu redakcyjny ciężar, podczas gdy Inter obsługuje całą treść interfejsu, a JetBrains Mono i SF Mono pełnią rolę w kontekstach kodu. Wyniesienie elementów osiągnięto za pomocą wewnętrznych, białych obramówek z łagodnym blaskiem (rgba(255,255,255,0.2), 1.5px inset) zamiast cieni, co nadaje interfejsowi estetykę szklanych paneli. System odstępów oparty jest na wielokrotnościach 4px z wyraźnym rytmem 8/12/16/24/32. Promienie zaokrągleń są małe, przy czym dominuje 4px, a dla kart i kontenerów hero stosowane są selektywnie 8px i 16px.

Podgląd strony Shopify
Usługi biznesowe i profesjonalne

Shopify

Strona główna marketingowa Shopify opiera się na dynamicznym, pełnoekranowym wideo w sekcji hero, z niemal czarnym tłem (#02090a), które wyraźnie kontrastuje z białym paskiem nawigacji nad nim. Główny akcent marki to intensywna miętowa zieleń (#36f4a4), używana oszczędnie do wyróżnień i stanów interaktywnych. Typografia łączy NeueHaasGrotesk w nagłówkach display i redakcyjnych z Inter-Variable w tekstach interfejsu. Przyciski CTA mają w pełni zaokrąglone kształty pigułki (border-radius: 9999px). Cały system jest pewny siebie, o wysokim kontraście i aspiracyjny, zaprojektowany tak, by zamieniać odwiedzających w sprzedawców.

Podobne palety