Panoramica
Codifica a colori margini / padding / distanze in base al valore px sulle pagine web, con un menu mobile e badge per un'ispezione…
Spacing Palette is a visualization tool that lets developers read every margin, padding, and gap on a web page at a glance. It frees you from opening DevTools and chasing the Styles panel every time you check spacing. Once enabled, the entire page is automatically color-coded, and px numbers are shown at the center of each overlay. Values are grouped into three families: other even numbers in orange→red, multiples of 8 or 4 (8px grid compliant) in yellow-green→green, and odd numbers in blue→purple. Hovering fades non-matching overlays so target spacing stands out. You can turn the px badges on or off as needed. The floating menu lists each px value with its M / P / G counts, and hovering a row highlights the matching overlays. You can drag or collapse the menu so it never gets in the way. Use the context menu to toggle the extension, overlay visibility, or the px badges from anywhere on the page. For web designers, front-end engineers, and QA teams who need to audit spacing consistency.
Dettagli
- Versione1.1.1
- Ultimo aggiornamento:22 agosto 2026
- Elemento offerto daKaworu Inoue
- Dimensioni35.94KiB
- Lingue14 lingue
- Sviluppatore
Email
dev_kwr@icloud.com - Non commercianteQuesto sviluppatore non si è identificato come commerciante. Per quanto riguarda i consumatori nell'Unione Europea, tieni presente che i diritti del consumatore non sono applicabili ai contratti stipulati tra te e questo sviluppatore.
Privacy
Questo sviluppatore dichiara che i tuoi dati:
- Non vengono venduti a terze parti, se non per i casi d'uso approvati.
- Non vengono usati o trasferiti per finalità non correlate alle funzionalità principali dell'elemento.
- Non vengono usati o trasferiti per stabilire l'affidabilità creditizia o per finalità di prestito.
