Retrieving theme values

If you need theme values at runtime, its best to retrieve them directly from tailwind or your tailwind.config.js. Tailwind CSS has documentation on referencing theme values in Javascript.

import colors from "tailwindcss/colors";

export function MyActivityIndicator(props) {
  return <ActivityIndicator size="small" color={colors.blue.500} {...props} />;
}

Or adding your custom colors into a shared file

// colors.js
module.exports = {
  'tahiti': {
    100: '#cffafe',
    200: '#a5f3fc',
    300: '#67e8f9',
    400: '#22d3ee',
    500: '#06b6d4',
    600: '#0891b2',
    700: '#0e7490',
    800: '#155e75',
    900: '#164e63',
  },
}

// tailwind.config.js
const colors = require("./colors")

module.exports = {
  theme: {
    extend: {
      colors
    }
  },
}

// MyActivityIndicator.js
import colors from "./colors";

export function MyActivityIndicator(props) {
  return <ActivityIndicator size="small" color={colors.tahiti.500} {...props} />;
}