Skip to content
color-kitnext
StartAPI
color-kit on GitHub
Start

Concepts

  • OKLCH-canonical
  • Requested vs displayed
  • Planes and queries
  • Gamut and tolerance
  • Contrast

Guides

  • Headless picker
  • React
  • Contrast-aware palettes
  • GPU and three.js
  • Performance

API

  • Overview
  • @pbroom/color-kit
      • ffunctionlighten
      • ffunctiondarken
      • ffunctionsaturate
      • ffunctiondesaturate
      • ffunctionadjustHue
      • ffunctionsetAlpha
      • ffunctionmix
      • ffunctionmixInto
      • ffunctioninvert
      • ffunctiongrayscale
  • @pbroom/color-kit/plane
  • @pbroom/color-kit/interop
  • @pbroom/color-kit/compute
  • @pbroom/color-kit/hct
  • @pbroom/color-kit/driver
  • @pbroom/color-kit/react
Map

@pbroom/color-kit/Manipulation

setAlpha

Return a copy of color with its alpha set to alpha, clamped to [0, 1].

functionimport { setAlpha } from '@pbroom/color-kit';index.ts:159
function setAlpha(  color: Color, ,  alpha: number,): Color;

Parameters

colorColor
Color to copy
alphanumber
New opacity (0 transparent to 1 opaque)

Returns

ColorA new Color

Example

TypeScript
import { parse, setAlpha, toCss } from '@pbroom/color-kit';

toCss(setAlpha(parse('#3b82f6'), 0.5), 'rgb'); // → 'rgb(59 130 246 / 0.5)'

Your display: detecting

MIT licensedSource