Cor nomeada do CSS
Cor MediumPurple #9370DB
MediumPurple (palavra-chave mediumpurple no CSS) tem o código hex #9370DB e o valor RGB rgb(147, 112, 219): um azul-violeta vivo e médio.
Um roxo-lavanda médio e suave (#9370db). É mais claro e azulado que purple e muito usado em tags e badges.
Códigos da cor MediumPurple
| Palavra-chave CSS | mediumpurple |
|---|---|
| HEX | #9370DB |
| RGB | rgb(147, 112, 219) |
| HSL | hsl(260, 60%, 65%) |
| HWB | hwb(260 44% 14%) |
| OKLCH | oklch(62.7% 0.158 296.7) |
| CMYK (simples, sem perfil ICC) | cmyk(33%, 49%, 0%, 14%) |
| Decimal | 9.662.683 |
| Família de matiz | Roxos e violetas |
Contraste e acessibilidade
Sobre mediumpurple, texto preto tem contraste de 5,58:1 e passa no AA para texto normal; texto branco fica em 3,76:1.
Razões de contraste do WCAG 2.2 (critérios 1.4.3 e 1.4.6: AA exige 4,5:1 para texto normal e 3:1 para texto grande; AAA exige 7:1 e 4,5:1). APCA Lc é o contraste de luminosidade do modelo APCA-W3 0.0.98G proposto para o WCAG 3; quanto maior o valor absoluto, mais legível, e Lc 75 é o mínimo sugerido para texto corrido.
| Combinação | Razão | AA | AA grande | AAA | AAA grande | APCA Lc |
|---|---|---|---|---|---|---|
| Texto preto sobre mediumpurple | 5,58:1 | Passa | Passa | Falha | Passa | 39,1 |
| Texto branco sobre mediumpurple | 3,76:1 | Falha | Passa | Falha | Falha | −70,5 |
| Texto mediumpurple sobre branco | 3,76:1 | Falha | Passa | Falha | Falha | 65,0 |
| Texto mediumpurple sobre preto | 5,58:1 | Passa | Passa | Falha | Passa | −36,7 |
Tons claros e escuros
Cada passo mistura mediumpurple com branco (tons claros) ou preto (tons escuros) em sRGB com correção gama, o mesmo resultado de color-mix(in srgb, mediumpurple, white 25%) no CSS.
Tons claros (misturados com branco)
- 5%
#9877dd - 15%
#a385e0 - 25%
#ae94e4 - 35%
#b9a2e8 - 45%
#c4b0eb - 55%
#cebfef - 65%
#d9cdf2 - 75%
#e4dbf6 - 85%
#efeafa - 95%
#faf8fd
Tons escuros (misturados com preto)
- 5%
#8c6ad0 - 15%
#7d5fba - 25%
#6e54a4 - 35%
#60498e - 45%
#513e78 - 55%
#423263 - 65%
#33274d - 75%
#251c37 - 85%
#161121 - 95%
#07060b
Harmonias de cor
Girando o matiz em OKLCH e mantendo luminosidade e croma, a complementar de mediumpurple é #839300 (perto de olivedrab), as análogas são #5C82E7 e #B861BA e a tríade se completa com #CD6A00 e #00A286. Para texto por cima, preto dá mais contraste.
| Harmonia | Rotação | Cor |
|---|---|---|
| Complementar | +180° | #839300 |
| Análogas | −30°, +30° | #5c82e7#b861ba |
| Tríade | +120°, +240° | #cd6a00#00a286 |
| Complementar dividida | +150°, +210° | #af8000#36a14a |
Calculadas em OKLCH: o matiz gira 180° (complementar), ±30° (análogas), ±120° (tríade) e 180° ±30° (complementar dividida), com luminosidade e croma mantidos. Quando o resultado sai do sRGB, ele é trazido de volta com o algoritmo de mapeamento de gama do CSS Color 4. Por usar OKLCH, os valores diferem das ferramentas que giram o matiz em HSL, mas as cores ficam com a mesma luminosidade percebida.
Quente ou fria?
MediumPurple é uma cor fria: o matiz fica em 260° no círculo HSL, na faixa dos verdes, azuis e violetas que por convenção se chama de fria.
Cores nomeadas e do Tailwind mais próximas
A distância é o ΔE OK, a distância euclidiana no OKLab multiplicada por 100. Valores abaixo de cerca de 2 são difíceis de distinguir lado a lado.
Cores nomeadas do CSS mais próximas
| Cor | HEX | ΔE OK |
|---|---|---|
| mediumslateblue | #7b68ee | 5,4 |
| mediumorchid | #ba55d3 | 8,3 |
| slateblue | #6a5acd | 9,0 |
Cores do Tailwind v4 mais próximas
| Cor | HEX | ΔE OK |
|---|---|---|
| indigo-400 | #7c86ff | 7,8 |
| violet-400 | #a684ff | 8,0 |
| violet-500 | #8e51ff | 9,5 |
Código
.element {
color: mediumpurple;
background-color: #9370db;
border-color: rgb(147 112 219);
outline-color: oklch(62.7% 0.158 296.7);
}<div class="bg-[#9370db] text-black">...</div>
/* ou registre uma vez no seu CSS (Tailwind v4) */
@theme {
--color-mediumpurple: #9370db;
}
/* depois use bg-mediumpurple, text-mediumpurple, border-mediumpurple */import SwiftUI
extension Color {
static let mediumpurple = Color(red: 0.576, green: 0.439, blue: 0.859)
}import androidx.compose.ui.graphics.Color
val Mediumpurple = Color(0xFF9370DB)import 'package:flutter/material.dart';
const mediumpurple = Color(0xFF9370DB);<!-- res/values/colors.xml -->
<color name="mediumpurple">#9370DB</color>Perguntas frequentes
- Qual é o código hex da cor mediumpurple?
- O código hex de mediumpurple é #9370DB. A mesma cor se escreve rgb(147, 112, 219), hsl(260, 60%, 65%) ou oklch(62.7% 0.158 296.7), e no CSS também dá para usar direto a palavra-chave mediumpurple.
- MediumPurple é uma cor quente ou fria?
- MediumPurple é uma cor fria: o matiz fica em 260° no círculo HSL, na faixa dos verdes, azuis e violetas que por convenção se chama de fria.
- Quais cores combinam com mediumpurple?
- Girando o matiz em OKLCH e mantendo luminosidade e croma, a complementar de mediumpurple é #839300 (perto de olivedrab), as análogas são #5C82E7 e #B861BA e a tríade se completa com #CD6A00 e #00A286. Para texto por cima, preto dá mais contraste.
- Dá para usar texto branco sobre mediumpurple?
- Texto branco sobre mediumpurple tem contraste de 3,76:1 e passa no AA só para texto grande (a partir de 24 px, ou 18,66 px em negrito) do WCAG 2.2. Texto preto chega a 5,58:1 e passa no AA para texto normal, mas não no AAA. No APCA, o valor é Lc −70,5 para branco e Lc 39,1 para preto.
- Qual é o RGB de mediumpurple?
- MediumPurple é rgb(147, 112, 219): vermelho 147, verde 112 e azul 219 na escala de 0 a 255, ou 57,6%, 43,9% e 85,9%. Em número decimal, 9662683.
Revisado em por Arielton Oberek.