Início
/
Design
/
Componentes
Design System
Componentes da interface
Página de demonstração com todos os elementos do template — botões, formulários,
modais, boxes, tabelas e estados — usando a identidade visual das páginas de
marcas e de detalhes do perfume.
11 seções
Escopo .pf-surface
Tema claro e escuro
24px
Raio do card
16px
Espaçamento base
#3C162F
Cor de destaque
Temas de site (tendências)
Clique para aplicar no <html> . Alternativa no inspetor:
document.documentElement.classList.add('theme-flux')
Marca
padrão Perfumopedia
Flux
indigo → pink
Nordic
azul → violeta
Ocean
sky → teal
Sunset
laranja → rose
Forest
emerald → lime
Neon
cyan → fuchsia
Peach
soft warm
Mono
zinc / charcoal
Prévia do tema
Título com o accent do tema
Textos e CTAs herdam --pp-grad , --site-accent e --site-grad-cta .
Primary
Ghost
Tokens da marca (--pp-*)
Destaque
--pp-accent · #3C162F
Destaque profundo
--pp-accent-deep · #3B0A2A
Gradiente CTA
--pp-grad
Lavanda
--pp-lavender · #F3EBF5
Superfície
--pp-soft · #F3F4F6
Texto
--pp-ink · #111827
Texto suave
--pp-muted · #6B7280
Borda
--pp-line-soft · #E5E7EB
Tokens de site (--site-*)
Accent --site-accent
Accent 2 --site-accent-2
CTA --site-grad-cta
Hero --site-grad-hero
Soft --site-grad-soft
Success --site-success
Warning --site-warning
Danger --site-danger
Raios e espaçamentos
Card --pf-radius: 24px
Bloco --pf-radius-sm: 16px
Pílula 999px
Gap --pf-gap: 16px
Os tokens --pp-* vivem em style.css
e podem ser sobrescritos pelos temas html.theme-* .
Botões e --site-* ficam em buttons.css .
Sobretítulo / eyebrow
.pf-eyebrow · 11.5px
Título da página
.pf-title · 30px
Título de seção
.pf-section-title · 19px
Texto corrente para descrições e conteúdo editorial.
14px / 1.6
Subtítulo de apoio, sempre em tom suave.
.pf-section-sub · 13.5px
Rótulo de bloco
11px · uppercase
Padrão da marca
Principal
Secundário
Excluir
Confirmar
Desabilitado
Cores sólidas — Flux (Tailwind-like)
Zinc
Red
Orange
Amber
Yellow
Lime
Green
Emerald
Teal
Cyan
Sky
Blue
Indigo
Violet
Purple
Fuchsia
Pink
Rose
Cores sólidas — marca e extras
Wine
Coral
Olive
Slate
Peach
Mint
Lavender
Sand
Charcoal
Snow
Gradientes — Flux / rainbow
Flux
Candy
Neon
Grape
Cosmic
Nightclub
Electric
Hyper
Bloom
Flamingo
Lilac
Plasma
Gradientes — frios / água
Ice
Wave
Aqua
Ocean
Sky
Polar
Nordic
Violet Sky
Deep Sea
Breeze
Haze
Ink
Gradientes — quentes
Mango
Lava
Fire
Sunset
Sunset Soft
Ember
Copper
Honey
Champagne
Citrus
Sherbet
Peach
Dawn
Gradientes — natureza / dark
Mint
Meadow
Forest
Moss
Sage
Radioactive
Aurora
Royal
Velvet
Twilight
Steel
Midnight
Cotton
Mirage
Gradientes — família da marca
Brand
Dusk
Berry
Rose
Orchid
Indigo
Tintas suaves — Flux
Zinc
Red
Orange
Amber
Yellow
Lime
Green
Emerald
Teal
Cyan
Sky
Blue
Indigo
Violet
Purple
Fuchsia
Pink
Rose
Tintas suaves — marca
Wine
Coral
Mint
Lavender
Peach
Sand
Success
Danger
Contorno colorido
Zinc
Red
Orange
Amber
Green
Emerald
Teal
Cyan
Sky
Blue
Indigo
Violet
Purple
Fuchsia
Pink
Rose
Wine
Success
Danger
Com ícone e tamanhos
Avaliar perfume
Favoritar
SM
SM
XS
Ícones circulares
favorite_border
add
bolt
auto_awesome
nightlight
electric_bolt
favorite
wb_sunny
water_drop
park
palette
Largura total
Continuar com Flux →
Tema Nordic
Criar conta
Sinalização
Chips, selos e notas
Chips de metadado
Feminino
Lançado em 1998
14 notas
Selos
Novo
Em alta
Rascunho
Ao vivo
Sem resposta
Você votou: 6h
Notas olfativas
Bergamota
Jasmim
Baunilha
Âmbar
Sândalo
Avatares
AL
MC
JP
AL
MC
JP
+9
Contêineres
Boxes e cards
Indicadores
7h
Fixação média
92%
Aprovação
12
Ofertas
Lista de ofertas
50 ml
a partir de R$ 389
100 ml
a partir de R$ 549
200 ml
a partir de R$ 899
Loja Exemplo
Eau de Parfum
Perfume Demo 50 ml original lacrado
R$ 389,90
Outra Loja
Eau de Toilette
Perfume Demo 50 ml com caixa
R$ 412,00
Preços de demonstração. Podem variar conforme a loja parceira.
Estados vazios e carregamento
local_florist
Nenhum perfume encontrado com esses filtros.
Limpar filtros
Carregando mais perfumes...
Votação
Seleção e filtros
Quanto tempo fixou em você?
Escolha uma opção para registrar sua percepção.
Sem resposta
Detestei
Não gostei
Indiferente
Gostei
Amei
Filtros com contagem
Todos 128
Feminino 54
Masculino 49
Unissex 25
128 perfumes
Limpar seleção
Assinatura olfativa (multisseleção)
Baunilha 42
Âmbar 38
Sândalo 31
Bergamota 27
Jasmim 19
Visualização
Dados e progresso
Barras de nível
O que a comunidade achou
412 votos
Amei
62%
Gostei
24%
Indiferente
9%
Não gostei
5%
Lançamentos por década
1970
1980
1990
2000
2010
2020
Progresso, etapas e spinner
check
Perfume
check
Notas
3
Avaliação
4
Publicar
Enviando sua avaliação...
Abas
Visão geral
Notas
Opiniões
Resumo do perfume, indicadores e ofertas em destaque.
Pirâmide olfativa completa, com topo, coração e base.
Comentários da comunidade e votações de fixação e ocasião.
Acordeão
O que significa EDP?expand_more
Eau de Parfum: concentração entre 15% e 20% de óleos essenciais, com fixação mais longa que o EDT.
Como as avaliações são calculadas?expand_more
A aprovação é a proporção de votos positivos (nota 4 ou 5) sobre o total de votos registrados.
Posso sugerir um perfume?expand_more
Sim. Use o botão de sugestão na página da marca e nossa curadoria avalia a inclusão no catálogo.
Menu suspenso
Mais opções
Paginação
Exibindo 24 de 128 perfumes. Role para carregar mais.
Painel lateral (offcanvas)
Abrir filtros
Sobreposições
Modais, avisos e toasts
Modais
Modal de formulário
Modal de confirmação
Modal de compartilhar
Modal de login (real)
Avisos em linha
info
Dica
Avalie o perfume depois de usá-lo por um dia inteiro para uma leitura mais precisa da fixação.
check_circle
Avaliação registrada
Seu voto já aparece nos gráficos da comunidade.
warning_amber
Confirme seu e-mail
Enviamos um link de confirmação para liberar os comentários.
error_outline
Não foi possível salvar
Verifique sua conexão e tente novamente em instantes.
Toasts
Sucesso
Informação
Erro
Faixa de destaque
Onde comprar
Ofertas das lojas parceiras
Comparação de preços atualizada diariamente.
12 ofertas
a partir de R$ 389,90
Ver todas as ofertas
Comunidade
Comentários e engajamento
Excluir avaliação?
Esta ação não pode ser desfeita e seus votos serão removidos dos gráficos.
Excluir definitivamente
Manter avaliação
Tudo certo! Ação concluída com sucesso.
Suas preferências foram atualizadas.
Não foi possível concluir a ação.