Function asColor

packages/tailwindcss/src/utilities.ts:213–237

(
  value: string,
  modifier: CandidateModifier | null,
  theme: Theme,
)

 * Resolve a color value + optional opacity modifier to a final color.
 */
export function asColor(
  value: string,
  modifier: CandidateModifier | null,
  theme: Theme,
): string | null {
  if (!modifier) return value

  if (modifier.kind === 'arbitrary') {
    return withAlpha(value, modifier.value)
  }

  // Check if the modifier exists in the `opacity` theme configuration and use
  // that value if so.
  let alpha = theme.resolve(modifier.value, ['--opacity'])
  if (alpha) {
    return withAlpha(value, alpha)
  }

  if (!isValidOpacityValue(modifier.value)) {
    return null
  }

  // The modifier is a bare value like `50`, so convert that to `50%`.
  return withAlpha(value, `${modifier.value}%`)
}

/**
 * Finds a color in the theme under one of the given theme keys that matches