StylingBox Shadow

Box Shadow

Use shadow prop to control the box shadow of an element.

Name

Value

sm

md

lg

none

Documentation

Usage

shadow=sm

shadow=md

shadow=lg

import { Box } from "@optiaxiom/react";
 
import { Canvas } from "../Canvas";
 
export function App() {
  return (
    <Canvas>
      <Box shadow="sm">shadow=sm</Box>
      <Box shadow="md">shadow=md</Box>
      <Box shadow="lg">shadow=lg</Box>
    </Canvas>
  );
}

Removing the shadow

shadow=none

import { Box } from "@optiaxiom/react";
 
import { Canvas } from "../Canvas";
 
export function App() {
  return (
    <Canvas>
      <Box shadow="none">shadow=none</Box>
    </Canvas>
  );
}