Pointy corners appear in this card when clicked and held when the card itself has rounded corners. I know Compose is declarative so I included the RoundedCornerShape before the .clickable property.
Card(
shape = RoundedCornerShape(18.dp),
modifier = Modifier
.width(160.dp)
.height(200.dp)
.clickable { /* ... */ },
) {
Box(
modifier = Modifier
.clip(RoundedCornerShape(18.dp)),
) {
// ...
}
}
See gray (subtle) corners in the image below:

As @shahid17june's answer already points out it is important to let the clipping happen before the clickable modifier is applied, so .clip(RoundedCornerShape(18.dp)) should be moved from the Box composable to the Card composable.
Better yet, though, is to remove both the clickable and the clip modifier and instead use the Card composable that has a dedicated onClick parameter:
Card(
onClick = { /* ... */ },
modifier = Modifier
.width(160.dp)
.height(200.dp),
shape = RoundedCornerShape(18.dp),
) {
Box {
// ...
}
}
That will properly handle clipping the shape under the hood, no need for you to meddle with it in the first place.
I also changed the parameter order to keep it in the same order as it is declared in the Card function. Please note that this is only a stylistic change to keep the code more clear, the parameter order has no impact on how the code is executed. That is a feature of Kotlin itself when using named parameters and has nothing to do with Compose.
Specifically adressing the statement from your question:
I know Compose is declarative so I included the
RoundedCornerShapebefore the.clickableproperty.
shape and modifier leads to the exact same result. The same applies to the onClick parameter introduced by this answer, and all other parameters you might want to use.