Descrição da ferramenta

CSS calc playground é um gerador e testador interativo de CSS calc para avaliar expressões CSS calc() em tempo real. Este testador de CSS calc permite que desenvolvedores experimentem com cálculos e vejam resultados instantâneos, ajudando a entender como diferentes unidades e operações interagem em CSS. Perfeito para testar múltiplas operações CSS calc e cálculos complexos antes de implementá-los em suas folhas de estilo.

Recursos

  • Gerador de CSS calc em tempo real com avaliação instantânea
  • Testador de CSS calc suportando todas as unidades CSS (px, em, rem, %, vh, vw, etc.)
  • Suporte para múltiplas operações CSS calc (+, -, *, /)

Operações suportadas

  • Adição: calc(100px + 50px) → 150px
  • Subtração: calc(100% - 20px) → calc(100% - 20px)
  • Multiplicação: calc(10px * 2) → 20px
  • Divisão: calc(100px / 2) → 50px
  • Expressões aninhadas: calc(calc(100px * 2) + 50px) → 250px
  • Unidades mistas: calc(50% + 25px)