title: How to create a circular Outlined button with jetpack compose
body: <p>I am trying to create a circular <code>OutlinedButton</code> with an icon in the center without text.</p>
  <pre><code>    OutlinedButton(onClick = { /*TODO*/ },
          shape = CircleShape,
          border= BorderStroke(1.dp, Color.Blue)
      ) {
          Icon(Icons.Default.Add, contentDescription = &quot;content description&quot;)
      }
  </code></pre>
  <p>The final button has an oval shape:</p>
  <p><a href="https://i.stack.imgur.com/8FeNI.png" rel="noreferrer"><img src="https://i.stack.imgur.com/8FeNI.png" alt="enter image description here" /></a></p>
  <p>Using an <code>IconButton</code>:</p>
  <pre><code>    IconButton(onClick = {  },
          modifier = Modifier
              .clip(CircleShape)
              .border(1.dp, Color.Red)
      ) {
          Icon(Icons.Default.Add, contentDescription = &quot;content description&quot;,tint = Color.Red)
      }
  </code></pre>
  <p>This is the final result:</p>
  <p><a href="https://i.stack.imgur.com/SYobJ.png" rel="noreferrer"><img src="https://i.stack.imgur.com/SYobJ.png" alt="enter image description here" /></a></p>