Product Engagement Growth UI

Brand Trust Blue
#2563eb
Warm Welcome Sand
#fff7ed
Conversion Coral
#f97316
Retention Mint
#34d399
Feedback Violet
#8b5cf6
Metrics Charcoal
#374151

A paleta consiste em cores Semi escuro, Luz. Cores de destaque Warm Welcome Sand #fff7ed e Feedback Violet #8b5cf6. A paleta tem Legal, Neutro, Esquentar temperatura de cores.

Em luminosidade, a paleta vai de #374151 (mais escuro) a #FFF7ED (mais claro). A faixa de luminosidade é ampla.

A saturação global parece vívida (croma alto).

Alguns pares de matizes estão perto de posições complementares — pode ler-se como contraste complementar (heurística).

No geral, a temperatura tende para o frio.

Códigos HEX (ordenados): #2563EB, #34D399, #374151, #8B5CF6, #F97316, #FFF7ED

A paleta Product Engagement Growth UI tem uma combinação de cores de códigos de 6:

HEX: #2563eb, RGB: (37, 99, 235); HEX: #fff7ed, RGB: (255, 247, 237); HEX: #f97316, RGB: (249, 115, 22)

HEX: #34d399, RGB: (52, 211, 153); HEX: #8b5cf6, RGB: (139, 92, 246); HEX: #374151, RGB: (55, 65, 81)

Versão simplificada das cores da paleta

Matiz de royalblue, Matiz de floralwhite, Sombra de chocolate, Matiz de mediumaquamarine, Matiz de mediumslateblue, Matiz de darkslateblue

O esquema de cores foi criado por hex

Mais paletas com:

Códigos de cores na paleta

Product Engagement Growth UI códigos de cores HEX, informações RGB na tabela

Cor	HEX	RGB	Nome	nome alternativo
#2563eb	#2563eb	RGB(37, 99, 235)	Brand Trust Blue	—
#fff7ed	#fff7ed	RGB(255, 247, 237)	Warm Welcome Sand	Fatback
#f97316	#f97316	RGB(249, 115, 22)	Conversion Coral	—
#34d399	#34d399	RGB(52, 211, 153)	Retention Mint	—
#8b5cf6	#8b5cf6	RGB(139, 92, 246)	Feedback Violet	—
#374151	#374151	RGB(55, 65, 81)	Metrics Charcoal	—

Contraste da Paleta de Cores

6 pares de cores têm contraste baixo e precisam de melhorias, o que pode afetar a legibilidade.

Cor do texto	Cor de fundo	Taxa de contraste
#2563eb	#f97316	1.84
#2563eb	#8b5cf6	1.22
#2563eb	#374151	1.99
#fff7ed	#34d399	1.81
#f97316	#34d399	1.45
#f97316	#8b5cf6	1.51

Paleta de imagens Product Engagement Growth UI png

--color-brand-trust-blue:	#2563eb;
--color-warm-welcome-sand:	#fff7ed;
--color-conversion-coral:	#f97316;
--color-retention-mint:	#34d399;
--color-feedback-violet:	#8b5cf6;
--color-metrics-charcoal:	#374151;

$color-brand-trust-blue:	#2563eb;
$color-warm-welcome-sand:	#fff7ed;
$color-conversion-coral:	#f97316;
$color-retention-mint:	#34d399;
$color-feedback-violet:	#8b5cf6;
$color-metrics-charcoal:	#374151;

@color-brand-trust-blue:	#2563eb;
@color-warm-welcome-sand:	#fff7ed;
@color-conversion-coral:	#f97316;
@color-retention-mint:	#34d399;
@color-feedback-violet:	#8b5cf6;
@color-metrics-charcoal:	#374151;