chevron_right

Gerador de Cronômetro Regressivo

Gere um cronômetro regressivo HTML incorporável ao vivo para qualquer data. Copie e cole o trecho em qualquer site sem scripts externos.

Data e hora alvo

Rótulo acima do temporizador

Mensagem ao expirar

Tema

Pré-visualização ao vivo

Launching In

Days

Hours

Minutes

Seconds

HTML incorporável

<div id="cd_3mhss6" style="font-family:system-ui,sans-serif;background:#0f172a;color:#f8fafc;padding:1.5rem;border-radius:0.75rem;text-align:center;display:inline-block;">
  <div style="font-size:1rem;margin-bottom:0.75rem;opacity:0.8">Launching In</div>
  <div class="cd-grid" style="display:flex;gap:0.75rem;justify-content:center;">
    <div style="background:#1e293b;padding:0.75rem 1rem;border-radius:0.5rem;min-width:4rem;"><div class="cd-d" style="font-size:2rem;font-weight:700;color:#38bdf8">0</div><div style="font-size:0.75rem;opacity:0.7">Days</div></div>
    <div style="background:#1e293b;padding:0.75rem 1rem;border-radius:0.5rem;min-width:4rem;"><div class="cd-h" style="font-size:2rem;font-weight:700;color:#38bdf8">0</div><div style="font-size:0.75rem;opacity:0.7">Hours</div></div>
    <div style="background:#1e293b;padding:0.75rem 1rem;border-radius:0.5rem;min-width:4rem;"><div class="cd-m" style="font-size:2rem;font-weight:700;color:#38bdf8">0</div><div style="font-size:0.75rem;opacity:0.7">Minutes</div></div>
    <div style="background:#1e293b;padding:0.75rem 1rem;border-radius:0.5rem;min-width:4rem;"><div class="cd-s" style="font-size:2rem;font-weight:700;color:#38bdf8">0</div><div style="font-size:0.75rem;opacity:0.7">Seconds</div></div>
  </div>
</div>
<script>(function(){var el=document.getElementById("cd_3mhss6"),t=1793382480000;function p(n){return String(n).padStart(2,"0")}function u(){var d=t-Date.now();if(d<=0){el.innerHTML='<div style="font-size:1.5rem;font-weight:700;color:#38bdf8">We're live!</div>';return}var s=Math.floor(d/1000),D=Math.floor(s/86400),H=Math.floor(s%86400/3600),M=Math.floor(s%3600/60),S=s%60;el.querySelector('.cd-d').textContent=D;el.querySelector('.cd-h').textContent=p(H);el.querySelector('.cd-m').textContent=p(M);el.querySelector('.cd-s').textContent=p(S);requestAnimationFrame(function(){setTimeout(u,1000)})}u()})();</script>

Ferramentas semelhantes

Gerador de código de incorporação 3D

Gere código de incorporação pronto para colar de um modelo 3D em quatro variantes, grátis e inteiramente no seu navegador.

Gerador de Horários Aleatórios

Gere horários aleatórios (HH:MM ou HH:MM:SS) dentro de um intervalo, em formato 12 ou 24 horas.

Gerador de Timestamps Unix

Gere o timestamp Unix atual, converta qualquer data, ou crie lotes de timestamps aleatórios.

Gerador de Datas Aleatórias

Gere datas aleatórias dentro de um intervalo especificado com opções de quantidade, formato e hora.

Editor de Marcadores PDF

Carregue, reorganize e reescreva a árvore de marcadores de um PDF visualmente: arraste para reordenar, mude páginas e preserve os destinos intactos.

Inspetor de Dependências 3D

Audite o que um arquivo GLB ou GLTF referencia em relação ao que ele realmente contém.

Conversor em lote de EML para PDF

Transforme mensagens guardadas em PDF de arquivo — um por mensagem ou um só ficheiro — com texto real seleccionável.

apps

Mais ferramentas

Explore nossa colecao completa de ferramentas online gratuitas.

Gere um Cronômetro Regressivo em Segundos

Contagens regressivas criam urgência. Seja para lançar um produto, rodar uma promoção, marcar a chegada de um evento ou construir uma página coming soon, um temporizador ao vivo mantém os visitantes engajados e focados no que está por vir. O Gerador de Cronômetro Regressivo produz um snippet HTML completo e autocontido que você pode colar em qualquer site — WordPress, Shopify, Webflow, Notion, HTML puro — sem adicionar bibliotecas ou dependências externas.

O Que Você Obtém

Um <div> mais um <script> inline. Sem CDN, sem npm, sem etapa de build. O script se atualiza a cada segundo e gerencia o estado de expiração automaticamente.

Personalize

Data e hora alvo — escolha exatamente quando a contagem termina.
Rótulo — uma linha de texto acima das caixas (ex.: "Lançando em", "Oferta encerra em").
Mensagem de expiração — o que mostrar quando o cronômetro chegar a zero ("Estamos ao vivo!", "Esgotado" etc.).
Tema — Escuro, Claro ou Mínimo (herda a fonte e as cores do site pai).

Ideal Para

Lançamentos de produtos e campanhas no Kickstarter
Relâmpagos, Black Friday, ofertas por tempo limitado
Contagens para webinars ou transmissões ao vivo
Contagens para casamentos e eventos
Landing pages coming soon

Notas Técnicas

O snippet usa apenas JavaScript puro e CSS inline. Utiliza um ID aleatório único para que você possa colocar vários cronômetros na mesma página sem conflitos. A contagem usa o relógio do dispositivo do visitante — para timers de marketing estritamente sincronizados, considere um fallback no servidor.

Privacidade

O gerador funciona inteiramente no seu navegador. Nunca vemos sua data-alvo, seu rótulo nem as páginas em que você usa o snippet.