Opacity

  • Opacity: A CSS property that sets the transparency level of an element.

  • Value Range: Values range from 0 (fully transparent) to 1 (fully opaque).

  • Usage: opacity: 0.5; makes an element 50% transparent.

  • Inheritance: Applies to both the element and its children.

  • Use Cases: Used for effects like overlays, hover animations, and more.

UI Controls

The Opacity setting includes multiple input methods for convenience and precision:

  • Stepper Buttons (+ and –): Increase or decrease the opacity in small increments.

  • Numeric Input Field: Users can directly type a specific value (e.g., 0.75, 0.3) into the field for exact control.

  • Real-Time Preview: As the value is adjusted (via typing or clicking), the element updates immediately to reflect the new opacity level.

✅ Tip: Typing allows for faster, more accurate adjustments—especially useful when setting exact design specs.

PreviousForeground / Text ColorNextCursor

Last updated