Cards
Cards

Moon Phase

Tonight's lunar phase rendered with a shaded disc and illumination percent.

Waxing Gibbous

62% illuminated

Installation

caveui components are copy-paste Jetpack Compose built entirely on Material 3 — there's no caveui dependency to add. Make sure Material 3 is on your classpath (it ships with the Compose BOM), then copy the Usage snippet below into your project.

kotlin
// build.gradle.kts (module)
dependencies {
    implementation(platform("androidx.compose:compose-bom:2025.06.00"))
    implementation("androidx.compose.material3:material3")
}

Usage

kotlin
@Composable
fun MoonPhaseCard() {
  val illum = 0.62f
  ElevatedCard(Modifier.fillMaxWidth()) {
    Row(
      Modifier.padding(20.dp),
      verticalAlignment = Alignment.CenterVertically
    ) {
      Canvas(Modifier.size(72.dp)) {
        val r = size.minDimension / 2
        drawCircle(Color(0xFFECEFF1))
        val shadowW = size.width * (1f - illum)
        drawArc(
          Color(0xFF263238),
          90f, 180f, true,
          topLeft = Offset(shadowW, 0f),
          size = Size(size.width - shadowW, size.height)
        )
        drawArc(
          Color(0xFF263238),
          90f, -180f, true,
          size = Size(shadowW, size.height)
        )
      }
      Spacer(Modifier.width(20.dp))
      Column {
        Text(
          "Waxing Gibbous",
          style = MaterialTheme.typography.titleMedium
        )
        Text(
          "62% illuminated",
          style = MaterialTheme.typography.labelMedium,
          color = MaterialTheme.colorScheme
            .onSurfaceVariant
        )
      }
    }
  }
}