diff --git a/src/main/kotlin/org/jetbrains/plugins/template/weatherApp/model/WeatherForecastData.kt b/src/main/kotlin/org/jetbrains/plugins/template/weatherApp/model/WeatherForecastData.kt
index 5a39cc0..71e0e47 100644
--- a/src/main/kotlin/org/jetbrains/plugins/template/weatherApp/model/WeatherForecastData.kt
+++ b/src/main/kotlin/org/jetbrains/plugins/template/weatherApp/model/WeatherForecastData.kt
@@ -1,5 +1,7 @@
 package org.jetbrains.plugins.template.weatherApp.model
 
+import org.jetbrains.jewel.ui.icon.IconKey
+import org.jetbrains.plugins.template.weatherApp.ui.WeatherIcons
 import java.time.LocalDateTime
 
 /**
@@ -22,7 +24,7 @@ internal data class WeatherForecastData(
             0f,
             WindDirection.NORTH,
             0,
-            WeatherType.SUNNY
+            WeatherType.CLEAR
         )
     }
 }
@@ -30,13 +32,26 @@ internal data class WeatherForecastData(
 /**
  * Enum representing different weather types.
  */
-enum class WeatherType(val label: String) {
-    SUNNY("Sunny"),
-    CLOUDY("Cloudy"),
-    PARTLY_CLOUDY("Partly Cloudy"),
-    RAINY("Rainy"),
-    SNOWY("Snowy"),
-    STORMY("Stormy");
+enum class WeatherType(val label: String, val dayIconKey: IconKey, val nightIconKey: IconKey) {
+    CLEAR("Sunny", WeatherIcons.dayClear, WeatherIcons.nightHalfMoonClear),
+    CLOUDY("Cloudy", dayIconKey = WeatherIcons.cloudy, nightIconKey = WeatherIcons.cloudy),
+    PARTLY_CLOUDY(
+        "Partly Cloudy",
+        dayIconKey = WeatherIcons.dayPartialCloud,
+        nightIconKey = WeatherIcons.nightHalfMoonPartialCloud
+    ),
+    RAINY("Rainy", dayIconKey = WeatherIcons.dayRain, nightIconKey = WeatherIcons.nightHalfMoonRain),
+    RAINY_AND_THUNDER(
+        "Rainy and Thunder",
+        dayIconKey = WeatherIcons.dayRainThunder,
+        nightIconKey = WeatherIcons.nightHalfMoonRainThunder
+    ),
+    THUNDER("Thunder", dayIconKey = WeatherIcons.thunder, nightIconKey = WeatherIcons.thunder),
+
+    SNOWY("Snowy", dayIconKey = WeatherIcons.daySnow, nightIconKey = WeatherIcons.nightHalfMoonSnow),
+    TORNADO("Stormy", dayIconKey = WeatherIcons.tornado, nightIconKey = WeatherIcons.tornado),
+    FOG("Fog", dayIconKey = WeatherIcons.fog, nightIconKey = WeatherIcons.fog),
+    MIST("Mist", dayIconKey = WeatherIcons.mist, nightIconKey = WeatherIcons.mist);
 
     companion object {
         fun random(): WeatherType = entries.toTypedArray().random()
diff --git a/src/main/kotlin/org/jetbrains/plugins/template/weatherApp/ui/components/WeatherDetailsCard.kt b/src/main/kotlin/org/jetbrains/plugins/template/weatherApp/ui/components/WeatherDetailsCard.kt
index 7f1de0b..a839cdb 100644
--- a/src/main/kotlin/org/jetbrains/plugins/template/weatherApp/ui/components/WeatherDetailsCard.kt
+++ b/src/main/kotlin/org/jetbrains/plugins/template/weatherApp/ui/components/WeatherDetailsCard.kt
@@ -12,12 +12,15 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
-import org.jetbrains.jewel.ui.component.*
+import org.jetbrains.jewel.foundation.theme.JewelTheme
+import org.jetbrains.jewel.ui.component.ActionButton
+import org.jetbrains.jewel.ui.component.Icon
+import org.jetbrains.jewel.ui.component.Text
 import org.jetbrains.jewel.ui.icons.AllIconsKeys
 import org.jetbrains.plugins.template.weatherApp.model.WeatherForecastData
 import org.jetbrains.plugins.template.weatherApp.model.WeatherType
+import org.jetbrains.plugins.template.weatherApp.ui.WeatherIcons
 import java.time.LocalDateTime
-import java.time.LocalTime
 import java.time.format.DateTimeFormatter
 import kotlin.random.Random
 
@@ -58,11 +61,11 @@ internal fun WeatherDetailsCard(
                 modifier = Modifier.fillMaxWidth(),
                 horizontalArrangement = Arrangement.SpaceBetween
             ) {
-                // City name
+                // Current Time
                 Text(
-                    text = weatherForecastData.location.id,
+                    text = "Time: ${formatDateTime(weatherForecastData.currentTime)}",
                     color = textColor,
-                    fontSize = 28.sp,
+                    fontSize = JewelTheme.defaultTextStyle.fontSize,
                     fontWeight = FontWeight.Bold
                 )
 
@@ -81,6 +84,7 @@ internal fun WeatherDetailsCard(
                     )
                 }
             }
+
             Spacer(modifier = Modifier.height(16.dp))
 
             // Temperature and weather type column (vertically aligned)
@@ -88,42 +92,37 @@ internal fun WeatherDetailsCard(
                 modifier = Modifier.fillMaxWidth(),
                 horizontalAlignment = Alignment.CenterHorizontally
             ) {
+
+                Icon(
+                    key = WeatherIcons.cloudy,
+//                    key = if (isNightTime) weatherForecastData.weatherType.nightIconKey else weatherForecastData.weatherType.dayIconKey,
+                    contentDescription = weatherForecastData.weatherType.label,
+                    hint = CssStyleInlinerSvgPatchHint
+                )
+
+                Spacer(modifier = Modifier.height(8.dp))
+
                 // Temperature (emphasized)
                 Text(
                     text = "${weatherForecastData.temperature.toInt()}°C",
                     color = textColor,
-                    fontSize = 48.sp,
+                    fontSize = 32.sp,
                     fontWeight = FontWeight.ExtraBold
                 )
 
                 Spacer(modifier = Modifier.height(8.dp))
 
-                // Weather type
+                // City name
                 Text(
-                    text = weatherForecastData.weatherType.label,
+                    text = weatherForecastData.location.label,
                     color = textColor,
-                    fontSize = 24.sp,
+                    fontSize = 18.sp,
                     fontWeight = FontWeight.Bold
                 )
             }
 
             Spacer(modifier = Modifier.height(16.dp))
 
-            // Current time
-            Row(
-                modifier = Modifier.fillMaxWidth(),
-                horizontalArrangement = Arrangement.Center
-            ) {
-                // Simple text for time
-                Text(
-                    text = "Time: ${formatDateTime(weatherForecastData.currentTime)}",
-                    color = textColor,
-                    fontSize = 16.sp
-                )
-            }
-
-            Spacer(modifier = Modifier.height(16.dp))
-
             // Wind and humidity info
             Row(
                 modifier = Modifier.fillMaxWidth(),
@@ -152,12 +151,17 @@ internal fun WeatherDetailsCard(
  */
 fun getWeatherTypeColor(weatherType: WeatherType, baseColor: Color): Color {
     return when (weatherType) {
-        WeatherType.SUNNY -> Color.Yellow.copy(alpha = 0.2f)
+        WeatherType.CLEAR -> Color.Yellow.copy(alpha = 0.2f)
         WeatherType.CLOUDY -> Color.Gray.copy(alpha = 0.2f)
         WeatherType.PARTLY_CLOUDY -> Color.LightGray.copy(alpha = 0.2f)
+        WeatherType.RAINY_AND_THUNDER,
         WeatherType.RAINY -> Color.Blue.copy(alpha = 0.2f)
+
         WeatherType.SNOWY -> Color.White.copy(alpha = 0.3f)
-        WeatherType.STORMY -> Color.DarkGray.copy(alpha = 0.2f)
+        WeatherType.TORNADO -> Color.DarkGray.copy(alpha = 0.2f)
+        WeatherType.THUNDER -> Color.DarkGray.copy(alpha = 0.2f)
+        WeatherType.FOG -> Color.LightGray.copy(alpha = 0.2f)
+        WeatherType.MIST -> Color.LightGray.copy(alpha = 0.2f)
     }
 }