Análise de design web,
qual ferramenta usar?
O PixelKit oferece 8 ferramentas: inspeção CSS, extração de cores, tipografia, medição de espaçamento (px) e verificação de contraste WCAG 2.1 (AA 4.5:1 / AAA 7:1).
4 ferramentas grátis + 9 Pro para completar o workflow de design web de designers e desenvolvedores.
É possível experimentar o PixelKit sem instalar?
Sim — conheça as principais funcionalidades do PixelKit aqui mesmo, sem precisar instalar a extensão.
Quais funcionalidades o PixelKit oferece?
4 gratuitas + 5 exclusivas Pro, 8 ferramentas principais no total
Hoverify Inspetor
GrátisPasse o mouse sobre qualquer elemento para visualizar em tempo real Box Model, 6 propriedades Typography (font-family, size, weight, line-height, letter-spacing, color), Layout, Background e acessibilidade.
Extração de Paleta de Cores
ProColeta automaticamente todas as cores da página web e as classifica por categorias usando algoritmo de clusterização.
Inspetor de Fontes
ProVerifique instantaneamente 6 propriedades de elementos de texto: font-family, size, weight, line-height, letter-spacing e color.
Verificação de Contraste WCAG
ProCalcula em tempo real a taxa de contraste usando a fórmula WCAG 2.1. Determina os níveis AA (4.5:1) e AAA (7:1).
Medição de Espaçamento
ProExibe a distância horizontal, vertical e diagonal entre dois elementos em pixels (px) com linhas tracejadas vermelhas no estilo Figma.
Copiar CSS
ProCopie o CSS Computed de um elemento para a área de transferência com um único clique. É possível selecionar o escopo.
Grid Overlay
GrátisSobreponha um CSS Grid de 12 colunas para verificar visualmente o alinhamento do layout.
Style Strip
ProRemove o CSS progressivamente em 4 etapas para analisar a estrutura HTML.
Quanto custa o PixelKit?
Comece grátis ($0), Pro a $1/mês ou $20 vitalício. As 4 ferramentas básicas são grátis para sempre.
Free
- ✓Hoverify Inspetor
- ✓Color Picker (histórico de 5)
- ✓Grid Overlay
- ✓Screenshot (somente visível)
Pro Monthly
- ✓Todas as funcionalidades Free incluídas
- ✓Palette Extractor
- ✓Font Inspector
- ✓Spacing Measure
- ✓WCAG Contrast Checker
- ✓CSS Copy / Style Strip
- ✓Visual Editor / Layout Editor
- ✓Quick Theme / Presets
- ✓Todas as ferramentas da API
Pro Lifetime
- ✓Todas as funcionalidades Pro incluídas
- ✓Atualizações vitalícias
- ✓Suporte prioritário
Perguntas frequentes
O que é o PixelKit?+
O PixelKit é uma extensão Chrome para analisar e editar o design visual de páginas web. Oferece 8 ferramentas incluindo inspeção CSS, extração de cores, análise tipográfica, medição de espaçamento e verificação de contraste WCAG.
Como instalar o PixelKit?+
Pesquise 'PixelKit' na Chrome Web Store ou clique no botão de instalação na página inicial. Pronto para usar imediatamente após a instalação.
O PixelKit é gratuito?+
Sim, 4 ferramentas principais (Hoverify Inspetor, Color Picker, Grid Overlay, Screenshot) são grátis para sempre. O plano Pro custa $1/mês ou $20 vitalício.
Quais funcionalidades adicionais o plano Pro inclui?+
O plano Pro adiciona 9 ferramentas: Palette Extractor, Font Inspector, Spacing Measure, WCAG Contrast Checker, CSS Copy, Style Strip, Visual/Layout Editor, Quick Theme e Presets.
Como funciona a verificação de contraste WCAG?+
Calcula em tempo real a taxa de contraste entre a cor do texto e do fundo com base na fórmula WCAG 2.1. Determina automaticamente o nível AA (4.5:1 ou superior) e AAA (7:1 ou superior).
O PixelKit funciona em outros navegadores além do Chrome?+
Sim, o PixelKit pode ser instalado e usado em navegadores baseados em Chromium como Edge, Brave e Arc através da Chrome Web Store.
Como instalar o PixelKit?
Pesquise 'PixelKit' na Chrome Web Store ou clique no botão abaixo para ir diretamente à página de instalação.
Comece grátis e faça upgrade para o Pro quando precisar.