---
title: SelectItem
description: SelectItem
element: vaadin-select-item
---

## Description

`<vaadin-select-item>` is a Web Component for creating `<vaadin-select>` items.

### Styling

The following shadow DOM parts are available for styling:

Part name    | Description
-------------|----------------
`checkmark`  | The graphical checkmark shown for a selected item
`content`    | The element that wraps the slot

The following state attributes are available for styling:

Attribute    | Description
-------------|-------------
`active`     | Set when the item is pressed down, either with mouse, touch or the keyboard.
`disabled`   | Set when the item is disabled.
`focus-ring` | Set when the item is focused using the keyboard.
`focused`    | Set when the item is focused.
`selected`   | Set when the item is selected

The following custom CSS properties are available for styling:

Custom CSS property                |
:----------------------------------|
| `--vaadin-item-border-radius`    |
| `--vaadin-item-checkmark-color`  |
| `--vaadin-item-gap`              |
| `--vaadin-item-height`           |
| `--vaadin-item-padding`          |
| `--vaadin-item-text-align`       |

See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.

## Properties

### disabled

**Type:** `boolean`

If true, the user cannot interact with this element.

### selected

**Type:** `boolean`

If true, the item is in selected state.

### value

**Type:** `string`

Submittable string value. The default value is the trimmed text content of the element.

