> For the complete documentation index, see [llms.txt](https://meulencv.gitbook.io/flutter-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://meulencv.gitbook.io/flutter-documentation/widgets/buttons.md).

# Buttons

Buttons are components that can be clicked

{% hint style="info" %}
You need to install `package:flutter/material.dart`
{% endhint %}

There are different types of buttons:

## Contained button

They display contained text

```dart
ElevatedButton(
  onPressed: () {
      // Respond to button press
  },
  child: Text('CONTAINED BUTTON'),
)
```

Also, you can add an Icon

```dart
ElevatedButton.icon(
  onPressed: () {
      // Respond to button press
  },
  icon: Icon(Icons.add, size: 18),
  label: Text("CONTAINED BUTTON"),
)
```

## Text button

They only displays text

```dart
TextButton(
  onPressed: () {
      // Respond to button press
  },
  child: Text("TEXT BUTTON"),
)
```

Also, you can add an Icon

```dart
TextButton.icon(
  onPressed: () {
      // Respond to button press
  },
  icon: Icon(Icons.add, size: 18),
  label: Text("TEXT BUTTON"),
)
```

## RawMaterialButton

```dart
RawMaterialButton(
          // We set the shape to a rounded rectangle
          shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(100.0)),
          // Set the fill color
          fillColor: Colors.white,
          // Create a SizedBox for the dimensions
          child: const SizedBox(
            height: 50,
            width: 200.0,
            // Center everything
            child: Center(
              // Create the button's text
              child: Text(
                'Crear cuenta 🎉',
                // Set the text color
                style: TextStyle(color: Colors.black),
              ),
            ),
          ),
          onPressed: () {
            // Button action
          },
        ),
```

<https://material.io/components/buttons/flutter#toggle-button> 👈 more button info
