🚀Ship faster with beautiful components
NextUI Pro
  • New version v2.6.0 🔥
    • Docs
    • Components
    • Blog
    • Figma
    • Roadmap
  • 22.2K
    Guide
  • Introduction
  • Design Principles
  • Installation
  • CLI
  • Routing
    Updated
  • Forms
    New
  • Upgrade to v2
    Frameworks
  • Next.js
  • Vite
  • Remix
  • Astro
    Customization
  • Theme
  • Layout
    Updated
  • Colors
  • Customize theme
  • Create theme
  • Dark mode
    Updated
  • Override styles
  • Custom variants
    Components
  • Accordion
  • Autocomplete
    Updated
  • Alert
    New
  • Avatar
  • Badge
  • Breadcrumbs
  • Button
    Updated
  • Calendar
  • Card
  • Checkbox
    Updated
  • Checkbox Group
    Updated
  • Chip
  • Circular Progress
  • Code
  • Date Input
  • Date Picker
  • Date Range Picker
  • Divider
  • Dropdown
  • Drawer
    New
  • Form
    New
  • Image
  • Input
    Updated
  • Input OTP
    New
  • Kbd
  • Link
  • Listbox
    Updated
  • Modal
    Updated
  • Navbar
  • Pagination
  • Popover
  • Progress
  • Radio Group
    Updated
  • Range Calendar
  • Scroll Shadow
  • Select
    Updated
  • Skeleton
  • Slider
  • Snippet
  • Spacer
  • Spinner
  • Switch
    Updated
  • Table
  • Tabs
  • Toast
    Coming soon
  • Textarea
    Updated
  • Time Input
  • Tooltip
  • User
    API References
  • NextUI CLI
    Updated
  • NextUI Provider
    Updated

Spacer

Spacer is a component used to add space between components.

Storybook@nextui-org/spacerServer componentSourceStyles source

Installation

The above command is for individual installation only. You may skip this step if @nextui-org/react is already installed globally.

Import

Usage

Note: The x and y values are based on Tailwind Spacing Scale

API

Spacer Props

PropTypeDefault
x
Space
"1"
y
Space
"1"

Types

SnippetSpinner
Edit this page on GitHub

On this page

  • Installation
  • Import
  • Usage
  • API
  • Spacer Props
  • Types

  • Back to top
docs left background
docs right background

© 2024 NextUI Inc. All rights reserved.