Gerador de theme.json para WordPress

Monte um theme.json válido — e veja qual metade realmente muda seu site.

Roda no seu navegador. Nada é enviado.

Layout

contentSize é a largura padrão da coluna; wideSize é a que um bloco recebe quando marcado como “Largura ampla”.

Largura do conteúdo (px) Largura ampla (px)

Paleta

Elas viram propriedades personalizadas CSS e aparecem em todos os seletores de cor do editor.

Contraste (texto)

Base (fundo)

Destaque (links)

Opções

Tipografia fluidaGera tamanhos de fonte com clamp() que escalam com a viewport em vez de saltar nos breakpoints. appearanceToolsAtiva os controles de borda, espaçamento, tipografia e cor em uma única linha, em vez de habilitar cada um à mão. Aplicar também os stylesAdiciona um bloco styles para que a paleta realmente apareça no front end. Sem ele, as cores são apenas oferecidas no editor. Escala de espaçamentoGera um preset de espaçamento de 7 níveis para que os controles de padding e margem tenham valores razoáveis.

settings vs styles

theme.json

Salve isto como theme.json na raiz do seu tema. Ele é lido a cada carregamento de página, então não há etapa de build nem cache para limpar.

Sobre o Gerador de theme.json para WordPress

Um gerador de theme.json para WordPress que produz um arquivo version 3 válido: larguras de layout, uma paleta de cores, tipografia fluida e uma escala de espaçamento. Ele também torna visível a distinção que confunde todo mundo: settings oferece valores ao editor, styles os aplica no front end, e uma paleta sozinha não muda nada até que algo a use.

Relacionados

Outras ferramentas que você pode precisar

Laboratório de tamanhos de imagem do WordPress

Solte uma imagem. Veja todas as cópias que o WordPress vai gerar dela.