@sandlada/mdk/build/modules/elevation.js

A JavaScript library based on Material Design 3, providing data such as color, shape, shadow level, etc.

export class ElevationLevel {
    static Level0 = `var(--md-sys-elevation-level-0, 0)`;
    static Level1 = `var(--md-sys-elevation-level-1, 1)`;
    static Level2 = `var(--md-sys-elevation-level-2, 3)`;
    static Level3 = `var(--md-sys-elevation-level-3, 6)`;
    static Level4 = `var(--md-sys-elevation-level-4, 8)`;
    static Level5 = `var(--md-sys-elevation-level-5, 12)`;
}
export class ElevationBoxShaodw {
    static Level0 = `box-shadow: none`;
    static Level1 = `box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 1px -1px, rgba(0, 0, 0, 0.14) 0px 1px 1px 0px, rgba(0, 0, 0, 0.12) 0px 1px 3px 0px`;
    static Level2 = `box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 3px -2px, rgba(0, 0, 0, 0.14) 0px 3px 4px 0px, rgba(0, 0, 0, 0.12) 0px 1px 8px 0px`;
    static Level3 = `box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 5px -1px, rgba(0, 0, 0, 0.14) 0px 6px 10px 0px, rgba(0, 0, 0, 0.12) 0px 1px 18px 0px`;
    static Level4 = `box-shadow: rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px`;
    static Level5 = `box-shadow: rgba(0, 0, 0, 0.2) 0px 7px 8px -4px, rgba(0, 0, 0, 0.14) 0px 12px 17px 2px, rgba(0, 0, 0, 0.12) 0px 5px 22px 4px`;
}