tailwindcss Architecture Docs
Home / Function/ replaceAlpha() — tailwindcss Function Reference

replaceAlpha() — tailwindcss Function Reference

Architecture documentation for the replaceAlpha() function in utilities.ts from the tailwindcss codebase.

Function typescript CompilerEngine AstTransformation called by 2

Entity Profile

Dependency Diagram

graph TD
  7f9cdd8b_d232_6558_6182_eead52aa2507["replaceAlpha()"]
  7829d740_b77d_642a_6961_2b062dc27460["alphaReplacedShadowProperties()"]
  7829d740_b77d_642a_6961_2b062dc27460 -->|calls| 7f9cdd8b_d232_6558_6182_eead52aa2507
  db4785ee_f9d4_d30c_c923_4237d7c754d9["alphaReplacedDropShadowProperties()"]
  db4785ee_f9d4_d30c_c923_4237d7c754d9 -->|calls| 7f9cdd8b_d232_6558_6182_eead52aa2507
  style 7f9cdd8b_d232_6558_6182_eead52aa2507 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/utilities.ts lines 195–205

export function replaceAlpha(value: string, alpha: string): string {
  // Convert numeric values (like `0.5`) to percentages (like `50%`) so they
  // work properly with `color-mix`. Assume anything that isn't a number is
  // safe to pass through as-is, like `var(--my-opacity)`.
  let alphaAsNumber = Number(alpha)
  if (!Number.isNaN(alphaAsNumber)) {
    alpha = `${alphaAsNumber * 100}%`
  }

  return `oklab(from ${value} l a b / ${alpha})`
}

Domain

Subdomains

Called By

Source

Frequently Asked Questions

What does replaceAlpha() do?
replaceAlpha() is a function in the tailwindcss codebase.
What calls replaceAlpha()?
replaceAlpha() is called by 2 function(s): alphaReplacedDropShadowProperties, alphaReplacedShadowProperties.

Analyze Your Own Codebase

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

Try Supermodel Free