---
title: "UIKit button(s) component"
date: "2020-11-18T16:05:08+00:00"
summary: "Easily add customizable buttons to your layout with UIKit's Button(s) component. Create single or multiple buttons, style them, and control their alignment and responsiveness across devices for enhanced user interaction."
image:
type: "page"
url: "/drupal-starter-kits/add-ons/site-studio/uikit-buttons-component"
id: "11dfb749-3a97-4d72-bdf5-b55083dbebb2"
---

The Button(s) component provides the option to add a button (Link styled as a button) to a layout. It also provides the option to add multiple buttons displayed in a row or a column. 

**Key information about this component:**

Layout canvas elements
----------------------

*   **Container -** The Pattern repeater and Link element are placed within a Container. This is required to align the buttons Left, Center, or Right.
*   **Pattern repeater -** The Button element includes a link element nested within a Pattern repeater. The pattern repeater allows multiple buttons to be added. The Pattern repeater is linked to the Field repeater within the Component form.
*   **Link element -** Provides the link element.

Component form fields
---------------------

*   **Link to page or URL -** The page or URL for the link.
*   **Button text -** The text displayed on the button.
*   **Target -** The target window.
*   **Button style -** The style of the button. To add new styles to this, create additional **Link custom styles** and update the **Select field.**
*   **Align buttons -** Align the buttons to the Left, Center, or Right.
*   **Desktop, Tablet and Phone layouts -** Switches the layout of multiple buttons from Row to Column at each breakpoint.
*   **Add space below -** Adds a margin to the bottom of the container around the buttons. This is required to separate the buttons from content that might be placed below them.