CSS Paint Worklet: Personalizando Imagens de Fundo
2025-05-26

Este exemplo mostra como criar imagens de fundo dinâmicas usando CSS Paint Worklet. Definindo as propriedades personalizadas `--boxColor` e `--widthSubtractor`, e usando o seletor CSS `nth-of-type`, geramos imagens de fundo com cores e larguras variadas para os itens da lista. O JavaScript registra um script externo de paint worklet, `boxbg.js`, que contém a lógica para desenhar o fundo. O resultado final é personalizável; ajuste os valores das propriedades personalizadas nas Ferramentas do Desenvolvedor para alterar as cores e larguras.
Desenvolvimento
Fundo Personalizado