# Shapes

# Shapes

Artifact:[androidx.compose.material:material](https://developer.android.com/jetpack/androidx/releases/compose-material)  
[View Source](https://cs.android.com/search?q=file:androidx/compose/material/Shapes.kt+class:androidx.compose.material.Shapes)  
Added in[1.0.0](https://developer.android.com/jetpack/androidx/releases/compose-material#1.0.0)
Common/AllAndroid/JVM
  - Cmn  

  ```
  class Shapes
  ```

*** ** * ** ***

[Material Design shape](https://material.io/design/shape/about-shape.html)

Material surfaces can be displayed in different shapes. Shapes direct attention, identify components, communicate state, and express brand.

![Shape image](https://developer.android.com/images/reference/androidx/compose/material/shape.png)

Components are grouped into shape categories based on their size. These categories provide a way to change multiple component values at once, by changing the category's values. Shape categories include:

- Small components

- Medium components

- Large components

See[Material shape specification](https://material.io/design/shape/applying-shape-to-ui.html)

## Summary

|                                                                                                                                                                                                                                                                                                                         ### Public constructors                                                                                                                                                                                                                                                                                                                          |
|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|-----|
| [Shapes](https://developer.android.com/reference/kotlin/androidx/compose/material/Shapes#Shapes(androidx.compose.foundation.shape.CornerBasedShape,androidx.compose.foundation.shape.CornerBasedShape,androidx.compose.foundation.shape.CornerBasedShape))`(` ` small: `[CornerBasedShape](https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape)`,` ` medium: `[CornerBasedShape](https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape)`,` ` large: `[CornerBasedShape](https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape) `)` | Cmn |

|                                        ### Public functions                                         |
|-----------------------------------------------------------------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|-----|
| [Shapes](https://developer.android.com/reference/kotlin/androidx/compose/material/Shapes)           | [copy](https://developer.android.com/reference/kotlin/androidx/compose/material/Shapes#copy(androidx.compose.foundation.shape.CornerBasedShape,androidx.compose.foundation.shape.CornerBasedShape,androidx.compose.foundation.shape.CornerBasedShape))`(` ` small: `[CornerBasedShape](https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape)`,` ` medium: `[CornerBasedShape](https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape)`,` ` large: `[CornerBasedShape](https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape) `)` Returns a copy of this Shapes, optionally overriding some of the values. | Cmn |
| `open operator `[Boolean](https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-boolean/index.html) | [equals](https://developer.android.com/reference/kotlin/androidx/compose/material/Shapes#equals(kotlin.Any))`(other: `[Any](https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-any/index.html)`?)`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         | Cmn |
| `open `[Int](https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-int/index.html)                  | [hashCode](https://developer.android.com/reference/kotlin/androidx/compose/material/Shapes#hashCode())`()`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | Cmn |
| `open `[String](https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-string/index.html)            | [toString](https://developer.android.com/reference/kotlin/androidx/compose/material/Shapes#toString())`()`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | Cmn |

|                                                 ### Public properties                                                 |
|-----------------------------------------------------------------------------------------------------------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|-----|
| [CornerBasedShape](https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape) | [large](https://developer.android.com/reference/kotlin/androidx/compose/material/Shapes#large()) Shape used by large components like[ModalDrawer](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#ModalDrawer(kotlin.Function1,androidx.compose.ui.Modifier,androidx.compose.material.DrawerState,kotlin.Boolean,androidx.compose.ui.graphics.Shape,androidx.compose.ui.unit.Dp,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,kotlin.Function0))or[ModalBottomSheetLayout](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#ModalBottomSheetLayout(kotlin.Function1,androidx.compose.ui.Modifier,androidx.compose.material.ModalBottomSheetState,kotlin.Boolean,androidx.compose.ui.graphics.Shape,androidx.compose.ui.unit.Dp,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,kotlin.Function0)). | Cmn |
| [CornerBasedShape](https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape) | [medium](https://developer.android.com/reference/kotlin/androidx/compose/material/Shapes#medium()) Shape used by medium components like[Card](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#Card(androidx.compose.ui.Modifier,androidx.compose.ui.graphics.Shape,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.foundation.BorderStroke,androidx.compose.ui.unit.Dp,kotlin.Function0))or[AlertDialog](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#AlertDialog(kotlin.Function0,kotlin.Function0,androidx.compose.ui.Modifier,kotlin.Function0,kotlin.Function0,kotlin.Function0,androidx.compose.ui.graphics.Shape,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.window.DialogProperties)).                                                                                                                                 | Cmn |
| [CornerBasedShape](https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape) | [small](https://developer.android.com/reference/kotlin/androidx/compose/material/Shapes#small()) Shape used by small components like[Button](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#Button(kotlin.Function0,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.compose.material.ButtonElevation,androidx.compose.ui.graphics.Shape,androidx.compose.foundation.BorderStroke,androidx.compose.material.ButtonColors,androidx.compose.foundation.layout.PaddingValues,kotlin.Function1))or[Snackbar](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#Snackbar(androidx.compose.ui.Modifier,kotlin.Function0,kotlin.Boolean,androidx.compose.ui.graphics.Shape,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.unit.Dp,kotlin.Function0)).                                                         | Cmn |

## Public constructors

### Shapes

Cmn  
Added in[1.0.0](https://developer.android.com/jetpack/androidx/releases/compose-material#1.0.0)  

```
Shapes(
    small: CornerBasedShape = RoundedCornerShape(4.dp),
    medium: CornerBasedShape = RoundedCornerShape(4.dp),
    large: CornerBasedShape = RoundedCornerShape(0.dp)
)
```

## Public functions

### copy

Cmn  
Added in[1.0.0](https://developer.android.com/jetpack/androidx/releases/compose-material#1.0.0)  

```
fun copy(
    small: CornerBasedShape = this.small,
    medium: CornerBasedShape = this.medium,
    large: CornerBasedShape = this.large
): Shapes
```

Returns a copy of this Shapes, optionally overriding some of the values.  

### equals

Cmn  

```
open operator fun equals(other: Any?): Boolean
```  

### hashCode

Cmn  

```
open fun hashCode(): Int
```  

### toString

Cmn  

```
open fun toString(): String
```

## Public properties

### large

Cmn  
Added in[1.0.0](https://developer.android.com/jetpack/androidx/releases/compose-material#1.0.0)  

```
val large: CornerBasedShape
```

Shape used by large components like[ModalDrawer](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#ModalDrawer(kotlin.Function1,androidx.compose.ui.Modifier,androidx.compose.material.DrawerState,kotlin.Boolean,androidx.compose.ui.graphics.Shape,androidx.compose.ui.unit.Dp,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,kotlin.Function0))or[ModalBottomSheetLayout](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#ModalBottomSheetLayout(kotlin.Function1,androidx.compose.ui.Modifier,androidx.compose.material.ModalBottomSheetState,kotlin.Boolean,androidx.compose.ui.graphics.Shape,androidx.compose.ui.unit.Dp,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,kotlin.Function0)).  

### medium

Cmn  
Added in[1.0.0](https://developer.android.com/jetpack/androidx/releases/compose-material#1.0.0)  

```
val medium: CornerBasedShape
```

Shape used by medium components like[Card](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#Card(androidx.compose.ui.Modifier,androidx.compose.ui.graphics.Shape,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.foundation.BorderStroke,androidx.compose.ui.unit.Dp,kotlin.Function0))or[AlertDialog](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#AlertDialog(kotlin.Function0,kotlin.Function0,androidx.compose.ui.Modifier,kotlin.Function0,kotlin.Function0,kotlin.Function0,androidx.compose.ui.graphics.Shape,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.window.DialogProperties)).  

### small

Cmn  
Added in[1.0.0](https://developer.android.com/jetpack/androidx/releases/compose-material#1.0.0)  

```
val small: CornerBasedShape
```

Shape used by small components like[Button](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#Button(kotlin.Function0,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.compose.material.ButtonElevation,androidx.compose.ui.graphics.Shape,androidx.compose.foundation.BorderStroke,androidx.compose.material.ButtonColors,androidx.compose.foundation.layout.PaddingValues,kotlin.Function1))or[Snackbar](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#Snackbar(androidx.compose.ui.Modifier,kotlin.Function0,kotlin.Boolean,androidx.compose.ui.graphics.Shape,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.unit.Dp,kotlin.Function0)). Components like[FloatingActionButton](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#FloatingActionButton(kotlin.Function0,androidx.compose.ui.Modifier,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.compose.ui.graphics.Shape,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.material.FloatingActionButtonElevation,kotlin.Function0)),[ExtendedFloatingActionButton](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#ExtendedFloatingActionButton(kotlin.Function0,kotlin.Function0,androidx.compose.ui.Modifier,kotlin.Function0,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.compose.ui.graphics.Shape,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.material.FloatingActionButtonElevation))use this shape, but override the corner size to be 50%.[TextField](https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#TextField(androidx.compose.foundation.text.input.TextFieldState,androidx.compose.ui.Modifier,kotlin.Boolean,kotlin.Boolean,androidx.compose.ui.text.TextStyle,kotlin.Function0,kotlin.Function0,kotlin.Function0,kotlin.Function0,kotlin.Boolean,androidx.compose.foundation.text.input.InputTransformation,androidx.compose.foundation.text.input.OutputTransformation,androidx.compose.foundation.text.KeyboardOptions,androidx.compose.foundation.text.input.KeyboardActionHandler,androidx.compose.foundation.text.input.TextFieldLineLimits,androidx.compose.foundation.ScrollState,androidx.compose.ui.graphics.Shape,androidx.compose.material.TextFieldColors,androidx.compose.foundation.interaction.MutableInteractionSource))uses this shape with overriding the bottom corners to zero.