Letreiro.
Marquesina de teatro antiguo de noche: marco de bombillas que se encienden en secuencia, placas intercambiables "EN CARTELERA", telón de terciopelo, reflector y entradas de rollo troqueladas. Nocturno, festivo y art déco.
- Tipo
- Landing page
- Tema
- Oscuro
- Títulos
- Limelight
- Texto
- Libre Franklin
ParaPúblico de cultura y ocio, 18-65 años, que compra entradas por función y quiere saber día, hora y clasificación
Secciones de la página01/09Topo e navegação
A marquise de um teatro antigo, à noite, com o letreiro aceso. Lâmpadas, veludo, holofote e ingresso de rolo. Festivo sem ser balada; nostálgico sem ser sépia.
Del DESIGN.md, que por ahora está en portugués.
ParaPúblico de cultura y ocio, 18-65 años, que compra entradas por función y quiere saber día, hora y clasificación
Paleta
Los cuatro colores que definen el diseño y todas las variables de tokens.css. Haz clic para copiar.
Tipografía
Limelight en los títulos, Libre Franklin en el texto.
TítulosLimelight
Aag!
Letreiro en una línea
ABCDEFGHIJKLMNOPQRSTUVWXYZ 0123456789
TextoLibre Franklin
La fuente de lectura sostiene párrafos largos sin cansar.
Texto corrido, botones, formularios y leyendas. Los títulos usan la fuente destacada; esta es la del día a día.
0123456789 · $1.234,56 · 25/09 a las 19:30
Para quién es
Lo que la IA compara con el cliente para elegir el diseño.
- sala con programación por función y venta de entradas
- marca con rojo, vino o dorado
- espacio con historia, fachada o letrero propio
- espectáculo en temporada
- curso online y lanzamiento digital
- festival de música electrónica o discoteca
- marca clara y minimalista
- servicio sin fecha ni horario
Tono
Lo que lo hace Letreiro
Las firmas del DESIGN.md: lo que no puede faltar al aplicarlo.Del DESIGN.md, que por ahora está en portugués.
- 01
Marquise de lâmpadas (
Lampadas): acendem uma a uma ao redor (--n× 45ms) e depois correm em trios (--f= n % 3). Uma marquise por tela, no máximo. - 02
Placas trocáveis (
Placas): letras brancas em trilho, cada uma levemente torta. Só para 1 a 3 palavras curtas ("EM CARTAZ", "ESTREIA", "HOJE"). - 03
Cortina de veludo em gradiente repetido, com bambinela em arcos e franja dourada no topo.
- 04
Holofote: cone em
conic-gradientque varre devagar. Sempre atrás do texto. - 05
Ingresso de rolo: tiras coladas uma na outra, bordas picotadas (mask), canhoto "Admite um", numeração em mono e carimbo "Esgotado". É a programação, não um card genérico.
- 06
Estrela art déco de 8 pontas como marcador; moldura
letreiro-decocom cantos em degrau. - 07
Tablado de madeira com ribalta (luzinhas) fechando o hero e a chamada final.
Reglas del juego
Directo del DESIGN.md.Del DESIGN.md, que por ahora está en portugués.
Identidade
- Fundo vinho quase preto
#140608; blocos emsurface#210c0f. Nunca preto puro. - Texto creme
#f6ead2; secundário#c9ae98. - Primária vermelho-veludo
#b8182e: botões de compra e cortinas. - Destaque dourado-lâmpada
#f5c451, sempre com brilho (letreiro-neon,--letreiro-brilho) quando for texto grande. Em fundo grande, só nos ingressos. - Fontes: Limelight (art déco) só em títulos, preços e horários. Libre Franklin no resto.
Regras
- Classificação indicativa é obrigatória em cada sessão e no espetáculo, com o selo nas cores oficiais (L verde, 10 azul, 12 amarelo, 14 laranja, 16 vermelho, 18 preto). Usar só a classificação informada pela produção; nunca inventar.
- Meia-entrada: sempre que houver preço, mostrar a meia e o bloco de quem tem direito (Lei nº 12.933/2013 e Decreto nº 8.537/2015: estudantes, 60+, PCD e acompanhante, ID Jovem). Conferir lei estadual/municipal do cliente (professores etc.) e ajustar a nota.
- Rodapé leva os dois avisos legais (classificação e meia-entrada).
- Animação: lâmpadas e holofote param com movimento reduzido; o resto é
data-sobe/data-revela. - Máximo de 2 botões por tela. Botão de compra sempre com ícone de ingresso.
- Seções com
py-24, larguramax-w-6xl.
Adaptar à marca do cliente
- Cor da marca vermelha, vinho ou dourada: troque
--d-primarye o vermelho da cortina. - Marca azul ou verde: a cortina pode virar veludo azul (troque as 6 paradas de
letreiro-cortinae da bambinela), mantenha o dourado das lâmpadas. - Cinema de rua: troque "Admite um" por "Sessão", sala por "Sala 1/2", mantenha a marquise.
- Espetáculo infantil: mantenha tudo, mas prefira placa "HOJE" e ingressos em amarelo e creme.
Dos archivos.
Un prompt.
Letreiro se vuelve el sistema de tu agente de código: arma cualquier pantalla con este estilo, no solo la landing de ejemplo.
Prompt para el agente Usar con IA
Lee el DESIGN.md en la raíz del proyecto y sigue sus reglas en cada pantalla. Importa sistema.css una sola vez en el punto de entrada del proyecto y usa sus clases y tokens en lugar de crear estilos nuevos. Antes de cada cambio de interfaz, vuelve a leer el DESIGN.md.
- 01Descarga los dos archivosDESIGN.md (las reglas visuales) y sistema.css (tokens, componentes y las firmas del diseño).
- 02Ponlos en el proyectoDESIGN.md en la raíz. sistema.css importado una vez en el punto de entrada: funciona en React, Vue, Svelte, HTML o WordPress.
- 03Pega el prompt en tu agenteLee las reglas y arma cualquier pantalla (login, precios, panel) con el estilo del diseño.
- 04Deja la regla fijaPon el prompt en las reglas del proyecto del agente para que cada pantalla nueva siga los mismos colores, fuentes y espaciados.
Similares
Landings con tono o nicho en común con Letreiro.
