Lewati ke konten
aksesin.Design system
FondasiKomponenAlur produk
Coba prototype
MULAI DI SINI
IkhtisarFondasi & tokenKomponen AksesinAlur produkTangkapan layar
PRIMITIVES30
Aksi⌄
ButtonDropdown Menu
Formulir⌄
FieldInputTextareaSelectCheckboxRadioSwitch
Tampilan Data⌄
CardBadgeChipAvatarTableStatProgressSkeleton
Umpan Balik⌄
AlertToastDialogSheetPopoverTooltipEmpty State
Navigasi⌄
TabsAccordionBreadcrumbPaginationStepper
Tata Letak⌄
Divider
Buka prototype
Sumber kebenaran visualToken → komponen → layar

Bingkai Tangkapan

Merender halaman mana pun di aplikasi ini dalam bingkai berukuran tetap, di atas kanvas netral, agar tangkapan layar untuk dokumen desain konsisten satu sama lain.

Mengapa memakai iframe, bukan render langsung

Varian responsif Tailwind (sm:, md:, lg:) dihitung terhadap viewport, bukan elemen induk. Menyusun bingkai selebar 390 piksel secara langsung tetap akan menampilkan tata letak desktop di dalamnya. Iframe memberi dokumen di dalamnya viewport 390 piksel yang sungguhan, sehingga yang kamu tangkap benar-benar tampilan ponsel.

Jalur relatif, misal /tokens

Tangkap pada 100% agar tajam.

Matikan untuk tangkapan polos tanpa bezel ponsel atau bilah peramban.

Kanvas

390 × 844 px · ditampilkan 75%

Potong tangkapan layar pada batas kanvas di atas. Kanvas memakai token --canvas sehingga ikut menyesuaikan pada mode gelap.