StylingBorder Width

Border Width

Use border prop to control the border width of an element.

Name

Value

 

0

1

2

Documentation

Usage

border=1

border=2

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

Single side

borderT=2

borderR=2

borderB=2

borderL=2

import { Box } from "@optiaxiom/react";
 
import { Canvas } from "../Canvas";
 
export function App() {
  return (
    <Canvas>
      <Box borderT="2">borderT=2</Box>
      <Box borderR="2">borderR=2</Box>
      <Box borderB="2">borderB=2</Box>
      <Box borderL="2">borderL=2</Box>
    </Canvas>
  );
}