Home / Function/ alpha() — tailwindcss Function Reference

alpha() — tailwindcss Function Reference

Architecture documentation for the alpha() function in css-functions.ts from the tailwindcss codebase.

Function typescript OxideCore Extractor calls 2

Entity Profile

Dependency Diagram

graph TD
  2bad1303_cbb5_27d5_f1f7_ece98cdf10cb["alpha()"]
  03b8d706_a876_a776_0056_186ced5d6067["segment()"]
  2bad1303_cbb5_27d5_f1f7_ece98cdf10cb -->|calls| 03b8d706_a876_a776_0056_186ced5d6067
  8412278d_9a59_ef02_8a3b_9c8e8ab65674["withAlpha()"]
  2bad1303_cbb5_27d5_f1f7_ece98cdf10cb -->|calls| 8412278d_9a59_ef02_8a3b_9c8e8ab65674
  style 2bad1303_cbb5_27d5_f1f7_ece98cdf10cb fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/css-functions.ts lines 19–40

function alpha(
  _designSystem: DesignSystem,
  _source: AstNode,
  value: string,
  ...rest: string[]
): string {
  let [color, alpha] = segment(value, '/').map((v) => v.trim())

  if (!color || !alpha) {
    throw new Error(
      `The --alpha(…) function requires a color and an alpha value, e.g.: \`--alpha(${color || 'var(--my-color)'} / ${alpha || '50%'})\``,
    )
  }

  if (rest.length > 0) {
    throw new Error(
      `The --alpha(…) function only accepts one argument, e.g.: \`--alpha(${color || 'var(--my-color)'} / ${alpha || '50%'})\``,
    )
  }

  return withAlpha(color, alpha)
}

Domain

Subdomains

Calls

Source

Frequently Asked Questions

What does alpha() do?
alpha() is a function in the tailwindcss codebase.
What does alpha() call?
alpha() calls 2 function(s): segment, withAlpha.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free