Skip to main content
FreeToolkit .ai

Cores do Sistema iOS e Android Navegue pelas cores do sistema para a Interface Humana do iOS e o Design de Material do Android.

Cores do Sistema iOS e Android illustration
🎨

Cores do Sistema iOS e Android

Navegue pelas cores do sistema para a Interface Humana do iOS e o Design de Material do Android.

1

Escolha a Plataforma

Selecione iOS (Interface Humana) ou Android (Material 3).

2

Alternar Aparência

Para iOS, alterne entre cores de modo claro e escuro.

3

Copiar Cores

Copie o código HEX de qualquer cor do sistema.

Loading tool...

What Is Cores do Sistema iOS e Android?

Esta ferramenta oferece uma referência completa para as cores do sistema iOS e Android - as cores pré-definidas recomendadas pela Apple e pelo Google para a construção de aplicativos nativos. As cores do sistema iOS seguem as Diretrizes de Interface Humana da Apple (HIG) e incluem cores com nomes semânticos como systemBlue, systemRed e variantes systemGray, cada uma com valores separados para os modos claro e escuro. As cores do Android seguem os tokens de design Material Design 3 (Material You), incluindo as cores Primária, Secundária, Terciária, Erro e Superfície. Usar as cores do sistema da plataforma garante que o aplicativo se sinta nativo, se adapte aos modos de aparência (claro/escuro) e mantenha os padrões de acessibilidade estabelecidos por cada plataforma. Esta referência economiza tempo dos desenvolvedores, evitando a necessidade de procurar na documentação e garantindo que eles usem exatamente os valores de cor especificados pela Apple e pelo Google.

Why Use Cores do Sistema iOS e Android?

  • Cores do sistema iOS completas com variantes de modos claro e escuro
  • Tokens de design Material 3 para desenvolvimento Android
  • Cores oficiais da plataforma para aparência e sensação nativas
  • Alternar entre modo claro e escuro (iOS)
  • Cópia em um clique para cada cor

Common Use Cases

Desenvolvimento iOS

Referencie os valores exatos de cores do sistema para desenvolvimento Swift/SwiftUI.

Desenvolvimento Android

Encontre valores de tokens de cor Material 3 para Kotlin/Jetpack Compose.

Design Cross-Plataforma

Compare cores do sistema iOS e Android ao projetar aplicativos cross-plataforma.

Bibliotecas Figma/Sketch

Configure bibliotecas de ferramentas de design com cores do sistema da plataforma precisas.

Technical Guide

As cores do sistema iOS são cores semânticas que se adaptam automaticamente entre as aparências claras e escuras. Por exemplo, systemBlue é #007AFF no modo claro e #0A84FF no modo escuro - ligeiramente mais brilhante para manter a proeminência visual contra fundos escuros. Os valores de cor são definidos nos frameworks UIKit (UIColor) e SwiftUI (Color) da Apple. O Material 3 do Android usa um sistema baseado em tokens: Primária, Secundária, Terciária para as cores principais, Superfície e Fundo para contêineres e variantes On-* para conteúdo nessas superfícies. Os tokens do Material 3 são projetados para funcionar com a geração de cor dinâmica a partir das imagens de fundo do usuário por meio do sistema Material You. Ambas as plataformas escolhem cores ligeiramente diferentes para o modo escuro para otimizar a percepção da luminosidade e do contraste contra as respectivas cores de fundo escuras.

Tips & Best Practices

  • 1
    As cores do sistema iOS se adaptam automaticamente no código - use UIColor.systemBlue em vez de HEX codificado
  • 2
    Os tokens Material 3 do Android devem ser usados por meio do MaterialTheme no Jetpack Compose
  • 3
    As cores do modo escuro são ligeiramente mais claras que as do modo claro para manter o peso visual em fundos escuros
  • 4
    Use nomes semânticos (cores do sistema) em vez de valores codificados para suporte automático ao modo escuro
  • 5
    O iOS tem seis níveis de cinza (systemGray até systemGray6) para diferentes níveis de hierarquia

Related Tools

Conversor HEX para RGB - free online tool

Conversor HEX para RGB

Converta códigos de cor HEX em valores RGB instantaneamente com uma pré-visualização ao vivo.

🎨 Color Tools
Seletor de Cores - free online tool

Seletor de Cores

Seletor de cores interativo com saídas em HEX, RGB, HSL e CMYK.

🎨 Color Tools
Verificador de Razão de Contraste - free online tool

Verificador de Razão de Contraste

Verifique as razões de contraste da WCAG entre cores de primeiro plano e segundo plano.

🎨 Color Tools
Paletas de Cores de Marcas - free online tool

Paletas de Cores de Marcas

Navegue pelas paletas de cores oficiais de mais de 50 marcas e empresas de tecnologia populares.

🎨 Color Tools
Cores do Material Design - free online tool

Cores do Material Design

Navegue pela paleta de cores completa do Material Design com todas as sombras e acentos.

🎨 Color Tools

Frequently Asked Questions

Q Por que as cores do modo escuro são diferentes das do modo claro?
As cores do modo escuro são ajustadas para manter o peso visual e a legibilidade em fundos escuros. Simplesmente inverter as cores do modo claro não produz resultados bons porque a percepção humana da brilho é não linear.
Q Devo usar esses valores HEX exatos no código nativo?
Prefira usar as APIs de plataforma (UIColor.systemBlue, MaterialTheme.colorScheme.primary) pois elas lidam com alterações de aparência automaticamente. Use esses valores HEX para ferramentas de design e referência.
Q Essas cores correspondem às últimas versões do SO?
Elas representam as cores padrão da plataforma. A Apple e o Google ocasionalmente ajustam os valores em novos lançamentos do SO. Verifique sempre contra a documentação mais recente do SDK para aplicativos de produção.

About This Tool

Cores do Sistema iOS e Android is a free online tool by FreeToolkit.ai. All processing happens directly in your browser — your data never leaves your device. No registration or installation required.