---
title: "Opacity properties"
date: "2017-11-11T12:49:10+00:00"
summary: "Control element transparency with CSS opacity. Learn how to set values from 0 (transparent) to 1 (opaque) for precise visual effects. Easily adjust visibility for enhanced design flexibility."
image:
type: "page"
url: "/drupal-starter-kits/add-ons/site-studio/opacity-properties"
id: "859a6109-b490-447e-844d-5bdc2b234625"
---

Set the opacity of an element. The opacity will be applied to the element and all of its children.

Opacity
-------

### Expected value:

*   Enter a number in the range 0.0 to 1.0
*   0.0 is transparent
*   1.0 is opaque
*   0.5 is 50% translucent
*   You cannot add a value greater than 1.0

### Accepted units:

*   **leave blank** - Do not add a unit after the number

Find more information at [https://developer.mozilla.org/en-US/docs/Web/CSS/opacity](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity)