Skip to content

Mobile

React Native Colors

React Native accepts named CSS colors, rgb(), hsl(), and hex strings in StyleSheet and inline style props on iOS and Android. Spec reference: Documentation.

Open color converter →

Starter template

const styles = StyleSheet.create({
  surface: { backgroundColor: '#7C3AED' },
  text: { color: 'rgb(124, 58, 237)' },
});

Color samples

FAQ

Hex strings vs PlatformColor?

Hex and rgb() strings work cross-platform. PlatformColor maps to iOS semantic system colors — not portable to Android.

Opacity in hex (#RRGGBBAA)?

Eight-digit hex appends alpha. You can also use rgba() in StyleSheet for readability.

Can I copy the syntax chips?

Yes — click the secondary chip to copy platform syntax. HEX and RGB chips copy sRGB values for mockups, design handoff, and ChromaXP tools.

Are RGB and CMYK print-ready?

RGB and CMYK here are computed from HEX for quick reference. For ink and paper, re-check against your print profile or Pantone bridge.