Skip to main content
Version: 1.0

Shadow

Shadow​

Utilities for controlling the box shadow of an element.

NamespacePreview
shadow-none
shadow-xs
shadow-sm
shadow
shadow-md
shadow-lg
shadow-xl
shadow-2xl

Custom Shadow​

If you didn't get suitable shadow for your project app.

Create Pre-defined​

You can define your shadow by adding in osmi.config.js file:

export default {
  // shadow
  shadow: {
    big: {
      shadowColor: string,
      shadowOffset: {
        width: number,
        height: number,
      },
      shadowOpacity: number,
      shadowRadius: number,
      elevation: number,
    },
  },
};

Usage​

apply("shadow-big");