Delírio.
Psychédélisme des années 70 en affiche : soleil-œil qui tourne avec texte en arc, titres groovy avec ombres colorées en couches, vagues entre les sections et billets à talon détachable.
- Type
- Landing page
- Thème
- Clair
- Titres
- Shrikhand
- Texte
- DM Sans
PourJeunes adultes de 18 à 40 ans qui sortent le soir et consomment musique, art et mode
Sections de la page01/08Topo e navegação
Psicodélico anos 70 em formato de cartaz de show. Cor saturada, formas redondas e movimento lento, como um pôster de festival colado na parede.
Extrait du DESIGN.md, en portugais pour l'instant.
PourJeunes adultes de 18 à 40 ans qui sortent le soir et consomment musique, art et mode
Palette
Les quatre couleurs qui définissent le design et toutes les variables de tokens.css. Cliquez pour copier.
Typographie
Shrikhand pour les titres, DM Sans pour le texte.
TitresShrikhand
Aag!
Delírio en une ligne
ABCDEFGHIJKLMNOPQRSTUVWXYZ 0123456789
TexteDM Sans
La police de lecture porte les longs paragraphes sans fatiguer.
Texte courant, boutons, formulaires et légendes. Les titres prennent la police d'affichage ; celle-ci fait le quotidien de la page.
0123456789 · 1 234,56 € · 25/09 à 19h30
Pour qui
Ce que l'IA compare avec le client pour choisir le design.
- agenda d'événements ou de dates
- vente de billets
- marque avec magenta, orange, violet ou jaune
- identité rétro/années 70
- public qui aime la couleur
- santé/clinique
- droit et services formels
- B2B corporate
- luxe discret
- public en quête de calme
Ton
Ce qui fait Delírio
Les signatures du DESIGN.md : ce qui ne doit pas manquer à l'application.Extrait du DESIGN.md, en portugais pour l'instant.
- 01
Sol-olho em SVG: pétalas girando devagar, anéis concêntricos pulsando e um olho no centro, com texto girando em arco (
textPath). - 02
Título com sombra sólida em camadas coloridas (
.delirio-camadas); versão leve (.delirio-camadas-leve) em títulos menores. - 03
Ondas em SVG entre as seções (componente
Onda). - 04
Blob com gradiente cônico (
.delirio-blob), inteiro ou desfocado no fundo. - 05
Adesivos em forma de flor com contorno tracejado, balançando.
- 06
Faixa de gêneros inclinada em mostarda com ✿ entre os itens.
- 07
Lineup em cartaz: headliners enormes, depois nomes médios e por fim os pequenos em caixa-alta.
- 08
Ingressos em tíquete: recortes nas laterais na linha de picote e serrilha embaixo.
Règles du jeu
Directement du DESIGN.md.Extrait du DESIGN.md, en portugais pour l'instant.
Identidade
- Fundo creme quente
#fff1dc, alternando com vinho profundo#3a0d2e(agenda, rodapé), pêssego#ffe4bd(ingressos) e laranja#ff6b1a(chamada final). Nunca branco puro nem preto. - Texto vinho escuro
#2a0a22; secundário#7a3f5c. - Paleta das artes (variáveis
--delirio-*): laranja#ff6b1a, magenta#e0218a(primária), roxo#6b2bd9, mostarda#ffc233, verde-água#2ec4b6. - Fontes: Shrikhand (groovy) em títulos, nomes de atrações, datas e preços; DM Sans no texto.
Regras
- Botões sempre em pílula com borda vinho de 2px e sombra sólida deslocada.
- No máximo 2 artes girando por tela; o resto fica parado.
- Texto corrido nunca em cima de gradiente: sempre sobre creme, vinho ou cartão.
- Animações próprias param com
prefers-reduced-motion.
Adaptar à marca do cliente
- Troque
--d-primarye as variáveis--delirio-*para a paleta da marca, mantendo 4 a 5 cores saturadas. - Estúdio de tatuagem: troque o creme por vinho em mais seções e use roxo e verde-água como principais.
- Loja de vinil/moda: a agenda vira "lançamentos" ou "drops", e os ingressos viram produtos.
- Marca de cor única e sóbria não combina com este design: escolha outro.
Deux fichiers.
Un prompt.
Delírio devient le design system de votre agent de code : il construit n'importe quel écran avec ce style, pas seulement la landing d'exemple.
Prompt pour l'agent Utiliser avec l'IA
Lis le DESIGN.md à la racine du projet et suis ses règles sur chaque écran. Importe sistema.css une seule fois au point d'entrée du projet et utilise ses classes et tokens au lieu de créer de nouveaux styles. Avant chaque changement d'interface, relis le DESIGN.md.
- 01Téléchargez les deux fichiersDESIGN.md (les règles visuelles) et sistema.css (tokens, composants et signatures du design).
- 02Ajoutez-les au projetDESIGN.md à la racine. sistema.css importé une fois au point d'entrée : fonctionne avec React, Vue, Svelte, HTML ou WordPress.
- 03Collez le prompt dans votre agentIl lit les règles et construit n'importe quel écran (connexion, tarifs, dashboard) avec le style du design.
- 04Fixez la règleMettez le prompt dans les règles du projet de l'agent pour que chaque nouvel écran suive les mêmes couleurs, polices et espacements.
Similaires
Des landings qui partagent un ton ou un secteur avec Delírio.