diff --git a/app/src/main/kotlin/org/cru/godtools/ui/tools/SquareToolCard.kt b/app/src/main/kotlin/org/cru/godtools/ui/tools/SquareToolCard.kt
index c1da038861..6d1455e77c 100644
--- a/app/src/main/kotlin/org/cru/godtools/ui/tools/SquareToolCard.kt
+++ b/app/src/main/kotlin/org/cru/godtools/ui/tools/SquareToolCard.kt
@@ -91,8 +91,9 @@ fun SquareToolCard(
 
     ProvideLayoutDirectionFromLocale(locale = { state.translation?.languageCode }) {
         ElevatedCard(
-            elevation = toolCardElevation,
             onClick = { eventSink(ToolCard.Event.Click) },
+            colors = toolCardColors,
+            elevation = toolCardElevation,
             modifier = modifier.width(189.dp)
         ) {
             Box(modifier = Modifier.fillMaxWidth()) {
diff --git a/app/src/main/kotlin/org/cru/godtools/ui/tools/ToolCardLayouts.kt b/app/src/main/kotlin/org/cru/godtools/ui/tools/ToolCardLayouts.kt
index 569e757adc..f9ff337559 100644
--- a/app/src/main/kotlin/org/cru/godtools/ui/tools/ToolCardLayouts.kt
+++ b/app/src/main/kotlin/org/cru/godtools/ui/tools/ToolCardLayouts.kt
@@ -10,6 +10,7 @@ import androidx.compose.foundation.layout.aspectRatio
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.widthIn
+import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.CardDefaults.elevatedCardElevation
 import androidx.compose.material3.ElevatedCard
 import androidx.compose.material3.LocalContentColor
@@ -51,6 +52,12 @@ internal const val TEST_TAG_TOOL_CATEGORY = "tool_category"
 
 internal val toolViewModels: ToolViewModels @Composable get() = viewModel()
 
+internal val toolCardColors @Composable get() = CardDefaults.elevatedCardColors(
+    containerColor = when {
+        GodToolsTheme.isLightColorSchemeActive -> MaterialTheme.colorScheme.background
+        else -> Color.Unspecified
+    }
+)
 internal val toolCardElevation @Composable get() = elevatedCardElevation(defaultElevation = 4.dp)
 
 internal val ToolCard.State.toolNameStyle: TextStyle
@@ -110,7 +117,6 @@ fun LessonToolCard(
 
     ProvideLayoutDirectionFromLocale(locale = { translation?.languageCode }) {
         ElevatedCard(
-            elevation = toolCardElevation,
             onClick = {
                 onEvent(
                     ToolCardEvent.Click(
@@ -120,6 +126,8 @@ fun LessonToolCard(
                     )
                 )
             },
+            colors = toolCardColors,
+            elevation = toolCardElevation,
             modifier = modifier.fillMaxWidth()
         ) {
             ToolBanner(state, modifier = Modifier.aspectRatio(335f / 80f))
@@ -207,9 +215,10 @@ fun ToolCard(
 
     ProvideLayoutDirectionFromLocale(locale = { translation?.languageCode }) {
         ElevatedCard(
+            onClick = { eventSink(ToolCard.Event.Click) },
+            colors = toolCardColors,
             elevation = toolCardElevation,
             interactionSource = interactionSource,
-            onClick = { eventSink(ToolCard.Event.Click) },
             modifier = modifier
         ) {
             Box(modifier = Modifier.fillMaxWidth()) {