A tela mostra o tempo até ou desde um momento como duração nos números do relógio, com uma unidade após cada grupo, para leitura clara à distância. Ela preenche toda a tela, fica no meio, se encaixa em um canto como um quadrado pequeno ou uma linha, ou corre como uma faixa ao longo de uma borda com uma barra preenchendo em direção ao alvo. Você define o momento alvo e escolhe contar regressivamente até ele ou progressivamente a partir dele, em blocos ou como um número grande. Você escolhe o rótulo, a mensagem no zero, e se permanece visível, aparece apenas perto do fim, ou desaparece no zero.
Cartão ao vivo
Categoria: Tempo. Tags: Contadores regressivos e temporizadores, Relógios e calendários, Eventos e locais, Lojas.
Layouts
Este cartão principal se encaixa em qualquer layout: tela cheia, centro, largo, canto, chip, faixa ou qualquer retângulo livre.
Layouts: cheio, centro, largo, canto, chip, faixa. Formas: paisagem, retrato, quadrado, faixa.
Layouts, temas e publicação de cartões. Veja os cartões.
Dados e privacidade
Este cartão usa suas propriedades configuradas e dados ao vivo do cartão.
Propriedades
Para tema, fundo, destaque e posição, veja Propriedades comuns.
Defina as propriedades estáticas nos params do cartão ao criá-lo. O documento de dados dele contém apenas propriedades dinâmicas. Linhas aninhadas descrevem o conteúdo da propriedade pai.
Propriedades estáticas
| Nome | Tipo | Padrão | Valores e limites | Descrição |
|---|---|---|---|---|
mode | string | "down" | "down", "up" | contagem regressiva até o alvo; contagem crescente desde então. |
style | string | "tiles" | "tiles", "hero" | tiles: os grupos da duração, cada um com sua unidade depois. hero: um número com sua unidade como sufixo e o rótulo como frase depois. |
largestUnit | string | "days" | "days", "hours" | O maior grupo: dias (com horas) distantes, ou apenas horas. |
showSeconds | boolean | true | Mostre o menor grupo: segundos dentro de um dia, minutos além dele. | |
hourCycle | string | "24" | "12", "24", "military" | Como o horário do dia do alvo é escrito: 7:30 PM, 19:30 ou 1930 HRS. |
start | string, nulo | null | Instante ISO 8601 em que a contagem regressiva começou: a faixa de uma tira se preenche do instante até o alvo. Sem ele, a faixa é o último dia antes do alvo. | |
presence | string | "always" | "always", "final", "until-zero" | sempre: ligado o tempo todo. final: somente nos últimos presenceWindow minutos e por doneSeconds após zero. até zero: desaparece no zero. |
presenceWindow | number | 10 | mínimo: 1; máximo: 1440 | Minutos antes do zero em que a presença final aparece. |
doneSeconds | number | 10 | mínimo: 0; máximo: 3600 | Segundos após zero que a presença final permanece ativa. |
timeZone | string, nulo | null | ||
backgroundColor | string, nulo | null | padrão: "^#[0-9A-Fa-f]{6}([0-9A-Fa-f]{2})?$" | Substitui o fundo e a placa do cartão por uma cor plana ordenada por CSS. #RRGGBBAA fornece opacidade. background none tem precedência. |
textColor | string, nulo | null | padrão: "^#[0-9A-Fa-f]{6}([0-9A-Fa-f]{2})?$" | Substitui as cores do texto principal e secundário. As cores de destaque e status semântico mantêm seus papéis. |
Propriedades dinâmicas
| Nome | Tipo | Padrão | Valores e limites | Descrição |
|---|---|---|---|---|
target | string | Obrigatório | ISO 8601 com deslocamento, ou local YYYY-MM-DDTHH:MM[:SS] em timeZone. | |
label | string | "" | maxLength: 80 | |
doneMessage | string | "" | maxLength: 80 |
Exemplo de tela
Salve as propriedades estáticas como params.json e crie o cartão. O resultado traz o id crd_ dele.
{
"theme": "neomustard"
}
screenrig card create --type countdown --major 1 --file params.json
Adicione este item aos primitives de uma página da playlist, com esse id no lugar do id do exemplo. Publique a playlist e atribua uma tela.
{
"id": "countdown",
"primitive": "card",
"card": "crd_01EXAMPLECARD000000000",
"layout": "full",
"content_fit": "fill"
}
Escrever dados ao vivo
Escreva o documento no cartão depois de criá-lo e depois substitua-o para atualizar a tela sem republicar. O cartão verifica cada gravação contra suas propriedades dinâmicas e recusa um documento que ele rejeita. Use o mesmo projeto da playlist.
Salve o documento como card-data.json. O CLI lê o documento em si, sem invólucro:
{
"target": "2026-10-15T12:00:00Z",
"label": "",
"doneMessage": ""
}
screenrig card data put crd_01EXAMPLECARD000000000 --file card-data.json
Ou chame a API diretamente. A API envolve o mesmo documento em um campo document. Um token de agente já nomeia seu projeto, então nenhum cabeçalho de projeto é enviado; se você enviar ScreenRig-Project, ele deve corresponder ao projeto do token. Forneça sua autorização de API pelo ambiente; veja Autenticação da API.
curl --request PUT "https://api.screenrig.ai/api/cards/crd_01EXAMPLECARD000000000/data" \
--header "Authorization: Bearer $SCREENRIG_TOKEN" \
--header "Content-Type: application/json" \
--data '{"document":{"target":"2026-10-15T12:00:00Z","label":"","doneMessage":""}}'