Open UI

Label

Import

  • Label: The main component to display a label.

Usage

import {Label} from '@openlite/ui'
 
function App() {
  return(
    <Label>Label</Label>
  )
}

Examples

Variants

import {Label} from '@openlite/ui'
 
function App() {
  return(
    <>
      <Label variant="none">Label none</Label>
      <Label variant="default">Label default</Label>
      <Label variant="primary">Label primary</Label>
      <Label variant="success">Label success</Label>
      <Label variant="warn">Label warn</Label>
      <Label variant="error">Label error</Label>
    </>
  )
}

Size

import {Label} from '@openlite/ui'
 
function App() {
  return(
    <>
      <Label size="sm">Label</Label>
      <Label size="md">Label</Label>
      <Label size="lg">Label</Label>
    </>
  )
}

API

Label Props

PropsTypeDescription
variant'none' | 'default' | 'primary' | 'success' | 'warn' | 'error'The variant of the label.
size'sm' | 'md' | 'lg'The size of the label.

On this page