Material Design

https://material.io/

Color #

https://material.io/resources/color/

ここで色を選んで#を0xFF(Full alpha)で置き換えればよい。

https://material.io/design/color/the-color-system.html

Type #

https://material.io/design/typography/the-type-system.html#type-scale

デフォルトサイズ #

Many places in our app automatically apply theme TextStyles, for example the TopAppBar styles it’s title as h6 and ListItem styles the main and secondary text to subtitle1 and body2 respectively.

Shape #

https://material.io/design/shape/

コンポーネントとサイズ(small, medium, large)の対応表 https://material.io/design/shape/applying-shape-to-ui.html#shape-scheme

Surfaceにsmallを適用 #

Surface(Modifier.fillMaxWidth(),
    shape=MaterialTheme.shapes.small)

Imageにsmallを適用 #

Image(
    painter = painter0!!,
    contentDescription = null,
    modifier = Modifier.size(vm.imageSize).clip(shape = MaterialTheme.shapes.small)

)

RowやColumnはレイアウトのためのものであるので、 背景色など考えると、SurfaceのなかにRow,Columnなどでレイアウトするのがよいだろう

Elevation #

https://material.io/design/environment/elevation.html#elevation-in-material-design

Typography #

https://material.io/design/typography/the-type-system.html#type-scale