Component library

Backdrop

Last updated 2 November 2026

Creates an overlay to hold other components.

Live demo

Default State

Light State

<ins-backdrop>
</ins-backdrop>

Attributes

FIELD ATTRIBUTE	TYPE	DEFAULT	OPTIONS	DESCRIPTION
light	boolean	false	true, false	Set backdrop color style to light / white.

Examples

Default State

<ins-button 
  solid 
  label="Element Behind">
</ins-button>

<ins-backdrop>

  <div>
    <h3>Hello World</h3>
 
 </div>

</ins-backdrop>

<style>
  ins-backdrop div { position: relative; z-index: 9999; }
</style>

Light State

<ins-button 
  solid 
  label="Element Behind">
</ins-button>

<ins-backdrop light>

  <div>
    <h3>Hello World</h3>
  </div>

</ins-backdrop>

<style>
  ins-backdrop div { position: relative; z-index: 9999; }
</style>