diff --git a/README.md b/README.md
index 9fbdc87..13289ae 100644
--- a/README.md
+++ b/README.md
@@ -80,12 +80,37 @@ resources:
 | `default_forecast`       | `string`          | `daily`      | Default forecast to view (`daily` or `hourly`).                                                                                                                                   |
 | `icons_path`             | `string`          | optional     | Path to custom icons. For example, `/local/img/my-custom-weather-icons`. See [Custom Weather Icons](#custom-weather-icons) for more details.                                      |
 | `show_condition_effects` | `boolean`/`array` | optional     | Enable animated weather condition effects. Set to `true` for all conditions or provide an array of specific effects. See [Weather Condition Effects](#weather-condition-effects). |
+| `current`                | `object`          | optional     | Current weather configuration options. See [Current Object](#current-object).                                                                                                     |
 | `forecast`               | `object`          | optional     | Forecast configuration options. See [Forecast Object](#forecast-object).                                                                                                          |
 | `forecast_action`        | `object`          | optional     | Actions for the forecast area. See [Forecast Actions](#forecast-actions).                                                                                                         |
 | `tap_action`             | `object`          | optional     | Defines the type of action to perform on tap for the main card. Action defaults to `more-info`. See [Home Assistant Actions](https://www.home-assistant.io/dashboards/actions/).  |
 | `hold_action`            | `object`          | optional     | Defines the type of action to perform on hold for the main card. See [Home Assistant Actions](https://www.home-assistant.io/dashboards/actions/).                                 |
 | `double_tap_action`      | `object`          | optional     | Defines the type of action to perform on double click for the main card. See [Home Assistant Actions](https://www.home-assistant.io/dashboards/actions/).                         |
 
+### Current Object
+
+The `current` object controls the display of current weather information and attributes.
+
+| Name              | Type                       | Default  | Description                                                                                                                                                                                                                                |
+| :---------------- | :------------------------- | :------- | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `show_attributes` | `boolean`/`string`/`array` | optional | Display weather attributes below current conditions. Set to `true` to show all available attributes, `false` to hide all, a single attribute name (e.g., `"humidity"`), or an array of attribute names (e.g., `["humidity", "pressure"]`). |
+
+**Available attributes:**
+
+- `humidity` - Relative humidity percentage
+- `pressure` - Atmospheric pressure
+- `wind_speed` - Wind speed with direction (if available)
+- `wind_gust_speed` - Wind gust speed
+- `visibility` - Visibility distance
+- `ozone` - Ozone level
+- `uv_index` - UV index
+- `dew_point` - Dew point temperature
+- `apparent_temperature` - Feels like temperature
+- `cloud_coverage` - Cloud coverage percentage
+
+> [!NOTE]
+> Attributes are only rendered if the data is available from your weather entity. If an attribute is not provided by your weather integration, it will not be displayed even if configured.
+
 ### Forecast Object
 
 | Name                 | Type    | Default  | Description                                                                                                                                                      |
@@ -113,6 +138,11 @@ Forecast actions have the following options
 ```yaml
 type: custom:weather-forecast-card
 entity: weather.home
+current:
+  show_attributes:
+    - humidity
+    - pressure
+    - wind_speed
 forecast:
   mode: chart
   extra_attribute: wind_direction
diff --git a/demo/index.html b/demo/index.html
index 3db3e44..f5ec977 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -23,6 +23,7 @@
         font-family: "Roboto", "Noto", sans-serif;
         color: var(--primary-text-color);
         --card-padding: 24px;
+        --state-icon-color: #44739e;
       }
       .light-theme {
         --primary-text-color: #141414;
@@ -324,7 +325,7 @@ <h3>For Home Assistant</h3>
     </div>
     <script type="module" src="../src/index.ts"></script>
     <script type="module">
-      import { MockHass } from "../test/mocks/hass.ts";
+      import { MockHass } from "../test/mocks/index.ts";
 
       const mockHass = new MockHass();
       let theme = "dark";
diff --git a/package.json b/package.json
index 35a0b6f..fcfbc26 100644
--- a/package.json
+++ b/package.json
@@ -41,6 +41,7 @@
   },
   "devDependencies": {
     "@eslint/js": "^9.39.2",
+    "@mdi/js": "^7.4.47",
     "@open-wc/testing": "^4.0.0",
     "@parcel/transformer-inline-string": "^2.16.3",
     "@types/lodash-es": "^4.17.12",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 22ab4da..b237dc9 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -39,6 +39,9 @@ importers:
       '@eslint/js':
         specifier: ^9.39.2
         version: 9.39.2
+      '@mdi/js':
+        specifier: ^7.4.47
+        version: 7.4.47
       '@open-wc/testing':
         specifier: ^4.0.0
         version: 4.0.0
@@ -375,6 +378,9 @@ packages:
     cpu: [x64]
     os: [win32]
 
+  '@mdi/js@7.4.47':
+    resolution: {integrity: sha512-KPnNOtm5i2pMabqZxpUz7iQf+mfrYZyKCZ8QNz85czgEt7cuHcGorWfdzUMWYA0SD+a6Hn4FmJ+YhzzzjkTZrQ==}
+
   '@mischnic/json-sourcemap@0.1.1':
     resolution: {integrity: sha512-iA7+tyVqfrATAIsIRWQG+a7ZLLD0VaOCKV2Wd/v4mqIU3J9c4jx9p7S0nw1XH3gJCKNBOOwACOPYYSUu9pgT+w==}
     engines: {node: '>=12.0.0'}
@@ -2830,6 +2836,8 @@ snapshots:
   '@lmdb/lmdb-win32-x64@2.8.5':
     optional: true
 
+  '@mdi/js@7.4.47': {}
+
   '@mischnic/json-sourcemap@0.1.1':
     dependencies:
       '@lezer/common': 1.4.0
diff --git a/src/components/wfc-current-weather-attributes.ts b/src/components/wfc-current-weather-attributes.ts
new file mode 100644
index 0000000..786e341
--- /dev/null
+++ b/src/components/wfc-current-weather-attributes.ts
@@ -0,0 +1,140 @@
+import { html, LitElement, nothing, TemplateResult } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import {
+  CurrentWeatherAttributes,
+  ExtendedHomeAssistant,
+  WeatherForecastCardConfig,
+} from "../types";
+import { getWeatherUnit, getWind, WeatherEntity } from "../data/weather";
+import { capitalize } from "lodash-es";
+import memoizeOne from "memoize-one";
+
+const ATTRIBUTE_ICON_MAP: { [key in CurrentWeatherAttributes]: string } = {
+  humidity: "mdi:cloud-percent-outline",
+  pressure: "mdi:gauge",
+  wind_speed: "mdi:weather-windy-variant",
+  wind_gust_speed: "mdi:weather-windy",
+  visibility: "mdi:eye",
+  ozone: "mdi:molecule",
+  uv_index: "mdi:weather-sunny-alert",
+  dew_point: "mdi:water-thermometer-outline",
+  apparent_temperature: "mdi:thermometer",
+  cloud_coverage: "mdi:cloud-outline",
+};
+
+@customElement("wfc-current-weather-attributes")
+export class WfcCurrentWeatherAttributes extends LitElement {
+  @property({ attribute: false }) hass!: ExtendedHomeAssistant;
+  @property({ attribute: false }) weatherEntity!: WeatherEntity;
+  @property({ attribute: false })
+  weatherAttributes: CurrentWeatherAttributes[] = [];
+  @property({ attribute: false }) config!: WeatherForecastCardConfig;
+
+  protected createRenderRoot() {
+    return this;
+  }
+
+  protected render(): TemplateResult | typeof nothing {
+    if (
+      !this.hass ||
+      !this.weatherEntity ||
+      this.weatherAttributes.length === 0
+    ) {
+      return nothing;
+    }
+
+    const attributeTemplates = this.weatherAttributes
+      .map((attr) => this._renderAttribute(attr))
+      .filter((template) => template !== nothing);
+
+    if (attributeTemplates.length === 0) {
+      return nothing;
+    }
+
+    return html`
+      <div class="wfc-current-attributes">${attributeTemplates}</div>
+    `;
+  }
+
+  private _renderAttribute(
+    attribute: CurrentWeatherAttributes
+  ): TemplateResult | typeof nothing {
+    const value = this.computeAttributeValue(attribute);
+
+    if (!value) {
+      return nothing;
+    }
+
+    return html`
+      <div class="wfc-current-attribute">
+        <ha-attribute-icon
+          class="wfc-current-attribute-icon"
+          .hass=${this.hass}
+          .stateObj=${this.weatherEntity}
+          .attribute=${attribute}
+          .icon=${ATTRIBUTE_ICON_MAP[attribute]}
+        ></ha-attribute-icon>
+        <span class="wfc-current-attribute-name">
+          ${this.localize(attribute)}
+        </span>
+        <span class="wfc-current-attribute-value">${value}</span>
+      </div>
+    `;
+  }
+
+  private computeAttributeValue = (
+    attribute: CurrentWeatherAttributes
+  ): string | undefined => {
+    const stateObj = this.weatherEntity;
+
+    if (stateObj.attributes[attribute] === undefined) {
+      return undefined;
+    }
+
+    if (attribute === "wind_speed") {
+      return getWind(this.hass, stateObj);
+    }
+
+    // hass.formatEntityAttributeValue does not support wind_gust_speed yet
+    if (
+      attribute === "wind_gust_speed" &&
+      stateObj.attributes.wind_gust_speed !== undefined
+    ) {
+      const unit = getWeatherUnit(this.hass, stateObj, "wind_gust_speed");
+
+      return `${stateObj.attributes.wind_gust_speed} ${unit}`;
+    }
+
+    // hass.formatEntityAttributeValue does not support ozone yet
+    if (attribute === "ozone" && stateObj.attributes.ozone !== undefined) {
+      const unit = getWeatherUnit(this.hass, stateObj, "ozone");
+
+      return `${stateObj.attributes.ozone} ${unit}`;
+    }
+
+    return this.hass.formatEntityAttributeValue(this.weatherEntity, attribute);
+  };
+
+  private localize = (attribute: string): string => {
+    return (
+      this.hass.formatEntityAttributeName(this.weatherEntity, attribute) ||
+      this.hass.localize(getLocalizationKey(attribute)) ||
+      capitalize(attribute).replace(/_/g, " ")
+    );
+  };
+}
+
+const getLocalizationKey = memoizeOne((attribute: string): string => {
+  switch (attribute) {
+    case "pressure":
+      return "ui.card.weather.attributes.air_pressure";
+    default:
+      return `ui.card.weather.attributes.${attribute}`;
+  }
+});
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "wfc-current-weather-attributes": WfcCurrentWeatherAttributes;
+  }
+}
diff --git a/src/components/wfc-current-weather.ts b/src/components/wfc-current-weather.ts
index 634aa3b..ed606af 100644
--- a/src/components/wfc-current-weather.ts
+++ b/src/components/wfc-current-weather.ts
@@ -10,6 +10,8 @@ import {
   hasAction,
 } from "custom-card-helpers";
 import {
+  CURRENT_WEATHER_ATTRIBUTES,
+  CurrentWeatherAttributes,
   ExtendedHomeAssistant,
   TemperatureHighLow,
   TemperatureInfo,
@@ -22,6 +24,7 @@ import {
 } from "../data/weather";
 
 import "./wfc-weather-condition-icon-provider";
+import "./wfc-current-weather-attributes";
 
 @customElement("wfc-current-weather")
 export class WfcCurrentWeather extends LitElement {
@@ -35,7 +38,7 @@ export class WfcCurrentWeather extends LitElement {
   }
 
   render(): TemplateResult | typeof nothing {
-    if (!this.weatherEntity) {
+    if (!this.hass || !this.weatherEntity) {
       return nothing;
     }
 
@@ -49,6 +52,7 @@ export class WfcCurrentWeather extends LitElement {
       this.config.forecast?.show_sun_times && suntimesInfo
         ? suntimesInfo.isNightTime
         : false;
+    const attributes = this.getConfiguredAttributes();
 
     return html`
       <div class="wfc-current-weather">
@@ -67,41 +71,73 @@ export class WfcCurrentWeather extends LitElement {
               ? html`<div class="wfc-name wfc-secondary">${name}</div>`
               : nothing}
           </div>
-        </div>
-        ${tempInfo !== null
-          ? html`
-              <div class="wfc-current-temperatures">
-                <div
-                  class="wfc-current-temperature"
-                  .actionHandler=${actionHandler({
-                    stopPropagation: true,
-                    hasHold: hasAction(this.config.hold_action as ActionConfig),
-                    hasDoubleClick: hasAction(
-                      this.config.double_tap_action as ActionConfig
-                    ),
-                  })}
-                  @action=${this.onAction}
-                >
-                  ${tempInfo.temperature}${tempInfo.temperatureUnit}
+          ${tempInfo !== null
+            ? html`
+                <div class="wfc-current-temperatures">
+                  <div
+                    class="wfc-current-temperature"
+                    .actionHandler=${actionHandler({
+                      stopPropagation: true,
+                      hasHold: hasAction(
+                        this.config.hold_action as ActionConfig
+                      ),
+                      hasDoubleClick: hasAction(
+                        this.config.double_tap_action as ActionConfig
+                      ),
+                    })}
+                    @action=${this.onAction}
+                  >
+                    ${tempInfo.temperature}${tempInfo.temperatureUnit}
+                  </div>
+                  ${tempHighLowInfo
+                    ? html`
+                        <div
+                          class="wfc-current-temperature-high-low wfc-secondary"
+                        >
+                          ${tempHighLowInfo.temperatureHigh}${tempHighLowInfo.temperatureHighLowUnit}
+                          /
+                          ${tempHighLowInfo.temperatureLow}${tempHighLowInfo.temperatureHighLowUnit}
+                        </div>
+                      `
+                    : nothing}
                 </div>
-                ${tempHighLowInfo
-                  ? html`
-                      <div
-                        class="wfc-current-temperature-high-low wfc-secondary"
-                      >
-                        ${tempHighLowInfo.temperatureHigh}${tempHighLowInfo.temperatureHighLowUnit}
-                        /
-                        ${tempHighLowInfo.temperatureLow}${tempHighLowInfo.temperatureHighLowUnit}
-                      </div>
-                    `
-                  : nothing}
-              </div>
-            `
+              `
+            : nothing}
+        </div>
+        ${attributes.length > 0
+          ? html`<wfc-current-weather-attributes
+              .hass=${this.hass}
+              .weatherEntity=${this.weatherEntity}
+              .config=${this.config}
+              .weatherAttributes=${attributes}
+            ></wfc-current-weather-attributes>`
           : nothing}
       </div>
     `;
   }
 
+  private getConfiguredAttributes(): CurrentWeatherAttributes[] {
+    const showAttr = this.config.current?.show_attributes;
+
+    if (showAttr === undefined || showAttr === null) {
+      return [];
+    }
+
+    if (Array.isArray(showAttr)) {
+      return showAttr;
+    }
+
+    if (typeof showAttr === "boolean") {
+      return showAttr ? [...CURRENT_WEATHER_ATTRIBUTES] : [];
+    }
+
+    if (typeof showAttr === "string") {
+      return [showAttr as CurrentWeatherAttributes];
+    }
+
+    return [];
+  }
+
   private onAction = (event: ActionHandlerEvent): void => {
     const config = this.config.temperature_entity
       ? {
diff --git a/src/data/weather.ts b/src/data/weather.ts
index 35104e3..d4dcc93 100644
--- a/src/data/weather.ts
+++ b/src/data/weather.ts
@@ -40,7 +40,7 @@ export interface ForecastAttribute {
   wind_bearing?: number;
 }
 
-interface WeatherEntityAttributes extends HassEntityAttributeBase {
+export interface WeatherEntityAttributes extends HassEntityAttributeBase {
   attribution?: string;
   humidity?: number;
   forecast?: ForecastAttribute[];
@@ -55,6 +55,12 @@ interface WeatherEntityAttributes extends HassEntityAttributeBase {
   temperature_unit: string;
   visibility_unit: string;
   wind_speed_unit: string;
+  wind_gust_speed?: number;
+  dew_point?: number;
+  uv_index?: number;
+  ozone?: number;
+  cloud_coverage?: number;
+  apparent_temperature?: number;
 }
 
 export interface ForecastEvent {
@@ -66,6 +72,79 @@ export interface WeatherEntity extends HassEntityBase {
   attributes: WeatherEntityAttributes;
 }
 
+const CARDINAL_DIRECTIONS = [
+  "N",
+  "NNE",
+  "NE",
+  "ENE",
+  "E",
+  "ESE",
+  "SE",
+  "SSE",
+  "S",
+  "SSW",
+  "SW",
+  "WSW",
+  "W",
+  "WNW",
+  "NW",
+  "NNW",
+] as const;
+
+export const getWindBearing = (
+  degree: number | string | undefined | null
+): string | undefined => {
+  if (degree == null) {
+    return undefined;
+  }
+
+  let degreenum = typeof degree === "number" ? degree : parseFloat(degree);
+
+  if (isNaN(degreenum) || !isFinite(degreenum)) {
+    return undefined;
+  }
+
+  degreenum %= 360;
+  if (degreenum < 0) {
+    degreenum += 360;
+  }
+
+  const index = Math.floor(degreenum / 22.5 + 0.5) % 16;
+
+  return CARDINAL_DIRECTIONS[index];
+};
+
+export const getWind = (
+  hass: ExtendedHomeAssistant,
+  stateObj: WeatherEntity
+): string | undefined => {
+  const speed = stateObj.attributes.wind_speed;
+  const bearing = stateObj.attributes.wind_bearing;
+
+  if (speed === null || speed === undefined) {
+    return undefined;
+  }
+
+  const speedText = hass.formatEntityAttributeValue(stateObj, "wind_speed");
+
+  if (bearing == null) {
+    return speedText;
+  }
+
+  const cardinalDirection = getWindBearing(bearing);
+
+  if (!cardinalDirection) {
+    return speedText;
+  }
+
+  const localizedDirection =
+    hass.localize(
+      `ui.card.weather.cardinal_direction.${cardinalDirection.toLowerCase()}`
+    ) || cardinalDirection;
+
+  return `${speedText} (${localizedDirection})`;
+};
+
 export const getWeatherUnit = (
   hass: ExtendedHomeAssistant,
   stateObj: WeatherEntity,
@@ -95,6 +174,10 @@ export const getWeatherUnit = (
       );
     case "wind_speed":
       return stateObj.attributes.wind_speed_unit || `${lengthUnit}/h`;
+    case "wind_gust_speed":
+      return stateObj.attributes.wind_speed_unit || `${lengthUnit}/h`;
+    case "ozone":
+      return "DU";
     case "cloud_coverage":
     case "humidity":
     case "precipitation_probability":
diff --git a/src/editor/weather-forecast-card-editor.ts b/src/editor/weather-forecast-card-editor.ts
index b28cc81..e150e19 100644
--- a/src/editor/weather-forecast-card-editor.ts
+++ b/src/editor/weather-forecast-card-editor.ts
@@ -5,14 +5,16 @@ import { customElement, property, state } from "lit/decorators.js";
 import memoizeOne from "memoize-one";
 import { capitalize } from "lodash-es";
 import {
-  HomeAssistant,
   fireEvent,
   LovelaceCardEditor,
   LocalizeFunc,
 } from "custom-card-helpers";
 import {
+  CURRENT_WEATHER_ATTRIBUTES,
+  ExtendedHomeAssistant,
   WEATHER_EFFECTS,
   WeatherForecastCardConfig,
+  WeatherForecastCardCurrentConfig,
   WeatherForecastCardForecastActionConfig,
   WeatherForecastCardForecastConfig,
 } from "../types";
@@ -37,6 +39,7 @@ type HaFormSchema = {
   name:
     | keyof WeatherForecastCardEditorConfig
     | `forecast.${keyof WeatherForecastCardForecastConfig}`
+    | `current.${keyof WeatherForecastCardCurrentConfig}`
     | `forecast_action.${keyof WeatherForecastCardForecastActionConfig}`
     | "";
   type?: string;
@@ -63,7 +66,7 @@ export class WeatherForecastCardEditor
   extends LitElement
   implements LovelaceCardEditor
 {
-  @property({ attribute: false }) public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: ExtendedHomeAssistant;
   @state() private _config!: WeatherForecastCardEditorConfig;
 
   public setConfig(config: WeatherForecastCardEditorConfig): void {
@@ -74,6 +77,7 @@ export class WeatherForecastCardEditor
     (localize: LocalizeFunc): HaFormSchema[] =>
       [
         ...this._genericSchema(localize),
+        ...this._currentWeatherSchema(localize),
         ...this._forecastSchema(localize),
         ...this._interactionsSchema(),
         ...this._advancedSchema(),
@@ -167,6 +171,26 @@ export class WeatherForecastCardEditor
       },
     ] as const;
 
+  private _currentWeatherSchema = (localize: LocalizeFunc): HaFormSchema[] =>
+    [
+      {
+        name: "current.show_attributes",
+        default: false,
+        optional: true,
+        selector: {
+          select: {
+            multiple: true,
+            options: CURRENT_WEATHER_ATTRIBUTES.map((attribute) => ({
+              value: attribute,
+              label:
+                localize(`ui.card.weather.attributes.${attribute}`) ||
+                capitalize(attribute).replace(/_/g, " "),
+            })),
+          },
+        },
+      },
+    ] as const;
+
   private _forecastSchema = (localize: LocalizeFunc): HaFormSchema[] =>
     [
       {
@@ -330,7 +354,7 @@ export class WeatherForecastCardEditor
       return nothing;
     }
 
-    const schema = this._schema(this.hass.localize);
+    const schema = this._schema(this.localize.bind(this));
 
     const data = denormalizeConfig(this._config);
 
@@ -376,6 +400,12 @@ export class WeatherForecastCardEditor
         );
       case "icons_path":
         return "Path to custom icons";
+      case "current.show_attributes":
+        return (
+          this.hass!.localize(
+            "ui.panel.lovelace.editor.card.generic.attribute"
+          ) || "attribute"
+        );
       case "forecast.extra_attribute":
         return `Extra ${(
           this.hass!.localize("ui.card.weather.forecast") || "forecast"
@@ -417,6 +447,8 @@ export class WeatherForecastCardEditor
         return "Optional temperature sensor entity to override the weather entity's temperature.";
       case "default_forecast":
         return "Select the default forecast type to show when forecasts are enabled. Users can still toggle between hourly and daily forecasts if both are available.";
+      case "current.show_attributes":
+        return "Select which weather attributes to display in the current weather section.";
       case "forecast.extra_attribute":
         return "Select an extra attribute to display below each forecast.";
       case "forecast_interactions":
@@ -474,15 +506,49 @@ export class WeatherForecastCardEditor
       }
     }
 
+    if (
+      Array.isArray(newConfig?.current?.show_attributes) &&
+      CURRENT_WEATHER_ATTRIBUTES.every((attribute) =>
+        newConfig.current.show_attributes.includes(attribute)
+      )
+    ) {
+      newConfig.current.show_attributes = true;
+    }
+
     fireEvent(this, "config-changed", { config: newConfig });
   }
+
+  private localize = (key: string): string => {
+    let result: string | undefined;
+
+    if (this._config?.entity && key.startsWith("ui.card.weather.attributes")) {
+      const entity = this.hass.states[this._config.entity];
+
+      if (entity) {
+        result = this.hass.formatEntityAttributeName(
+          entity,
+          key.replace("ui.card.weather.attributes.", "")
+        );
+      }
+    }
+
+    if (!result) {
+      result = this.hass.localize(key);
+    }
+
+    return result;
+  };
 }
 
 const moveDottedKeysToNested = (obj: Record<string, any>) => {
   const result: Record<string, any> = { ...obj };
 
   for (const key of Object.keys(obj)) {
-    if (!key.startsWith("forecast.") && !key.startsWith("forecast_action."))
+    if (
+      !key.startsWith("forecast.") &&
+      !key.startsWith("forecast_action.") &&
+      !key.startsWith("current.")
+    )
       continue;
 
     const parts = key.split(".");
@@ -516,6 +582,10 @@ const denormalizeConfig = (obj: Record<string, any>) => {
     result.show_condition_effects = [...WEATHER_EFFECTS];
   }
 
+  if (result["current.show_attributes"] === true) {
+    result["current.show_attributes"] = [...CURRENT_WEATHER_ATTRIBUTES];
+  }
+
   return result;
 };
 
@@ -537,6 +607,18 @@ const flattenNestedKeys = (obj: Record<string, any>) => {
       continue;
     }
 
+    if (
+      key === "current" &&
+      value &&
+      typeof value === "object" &&
+      !Array.isArray(value)
+    ) {
+      for (const innerKey in value) {
+        result[`current.${innerKey}`] = value[innerKey];
+      }
+      continue;
+    }
+
     if (
       key === "forecast_action" &&
       value &&
diff --git a/src/types.ts b/src/types.ts
index 68365f8..b36a753 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -17,6 +17,19 @@ export type ForecastActionEvent = HASSDomEvent<ForecastActionDetails>;
 
 export type ForecastActionHandler = (event: ForecastActionEvent) => void;
 
+export const CURRENT_WEATHER_ATTRIBUTES = [
+  "humidity",
+  "pressure",
+  "wind_speed",
+  "wind_gust_speed",
+  "visibility",
+  "ozone",
+  "uv_index",
+  "dew_point",
+  "apparent_temperature",
+  "cloud_coverage",
+] as const;
+
 export const WEATHER_EFFECTS = [
   "rain",
   "snow",
@@ -26,6 +39,9 @@ export const WEATHER_EFFECTS = [
   "sun",
 ] as const;
 
+export type CurrentWeatherAttributes =
+  (typeof CURRENT_WEATHER_ATTRIBUTES)[number];
+
 export type WeatherEffect = (typeof WEATHER_EFFECTS)[number];
 
 export enum ForecastMode {
@@ -45,6 +61,10 @@ export interface WeatherForecastCardForecastConfig {
   scroll_to_selected?: boolean;
 }
 
+export interface WeatherForecastCardCurrentConfig {
+  show_attributes?: boolean | CurrentWeatherAttributes | CurrentWeatherAttributes[];
+}
+
 export interface WeatherForecastCardForecastActionConfig {
   tap_action?: ForecastActionConfig;
   hold_action?: ForecastActionConfig;
@@ -61,6 +81,7 @@ export interface WeatherForecastCardConfig {
   default_forecast?: "hourly" | "daily";
   icons_path?: string;
   show_condition_effects?: boolean | WeatherEffect[];
+  current?: WeatherForecastCardCurrentConfig;
   forecast?: WeatherForecastCardForecastConfig;
   forecast_action?: WeatherForecastCardForecastActionConfig;
   tap_action?: ActionConfig | undefined;
@@ -71,11 +92,15 @@ export interface WeatherForecastCardConfig {
 export type ForecastActionConfig = ForecastToggleActionConfig | ActionConfig;
 
 export type ExtendedHomeAssistant = HomeAssistant & {
-  formatEntityState?: (stateObj: HassEntity) => string | undefined;
-  formatEntityAttributeValue?: (
+  formatEntityState: (stateObj: HassEntity) => string | undefined;
+  formatEntityAttributeValue: (
+    stateObj: HassEntity,
+    attribute: string
+  ) => string | undefined;
+  formatEntityAttributeName: (
     stateObj: HassEntity,
     attribute: string
-  ) => unknown;
+  ) => string | undefined;
   themes?: {
     darkMode: boolean;
   };
diff --git a/src/weather-forecast-card.css b/src/weather-forecast-card.css
index d840f69..fffb984 100644
--- a/src/weather-forecast-card.css
+++ b/src/weather-forecast-card.css
@@ -54,7 +54,7 @@ ha-card {
   width: 100%;
   display: flex;
   flex-direction: column;
-  gap: var(--ha-space-3, 12px);
+  gap: var(--ha-space-4, 16px);
   container-type: inline-size;
   container-name: wfc-container;
 }
@@ -66,16 +66,13 @@ ha-card {
 .wfc-current-weather {
   display: flex;
   flex-wrap: nowrap;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: center;
-  gap: var(--ha-space-3, 12px);
+  flex-direction: column;
+  gap: var(--ha-space-4, 16px);
   user-select: none;
   -webkit-user-select: none;
   cursor: pointer;
-  width: 100%;
-  max-width: 100%;
   min-width: 0;
+  width: 100%;
 }
 
 .wfc-current-conditions {
@@ -83,6 +80,7 @@ ha-card {
   flex-direction: row;
   align-items: center;
   min-width: 0;
+  width: 100%;
 }
 
 .wfc-name,
@@ -94,6 +92,10 @@ ha-card {
   min-width: 0;
 }
 
+.wfc-name-state {
+  flex: 1;
+}
+
 .wfc-current-temperature-high-low {
   white-space: nowrap;
 }
@@ -122,6 +124,43 @@ ha-card {
   white-space: nowrap;
 }
 
+.wfc-current-attributes {
+  display: flex;
+  flex-direction: column;
+  gap: var(--ha-space-1, 4px);
+  min-width: 0;
+  width: 100%;
+}
+
+.wfc-current-attribute {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--ha-space-1, 4px);
+  font-size: var(--ha-font-size-m, 14px);
+  line-height: var(--ha-line-height-condensed);
+  color: var(--primary-text-color, #212121);
+  white-space: nowrap;
+}
+
+.wfc-current-attribute-icon {
+  color: var(--state-icon-color, #616161);
+  padding-left: var(--ha-space-2, 8px);
+}
+
+.wfc-current-attribute-value,
+.wfc-current-attribute-name {
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+.wfc-current-attribute-name {
+  text-overflow: ellipsis;
+  padding-left: var(--ha-space-4, 16px);
+  flex: 1;
+}
+
 .wfc-forecast-container {
   --mask: linear-gradient(
     to right,
@@ -361,6 +400,7 @@ ha-card {
 
 wfc-wind-indicator,
 wfc-current-weather,
+wfc-current-weather-attributes,
 wfc-forecast-header-items,
 wfc-weather-condition-icon-provider {
   display: contents;
diff --git a/test/app/index.html b/test/app/index.html
index 8fe65fb..914fb7d 100644
--- a/test/app/index.html
+++ b/test/app/index.html
@@ -79,6 +79,10 @@ <h3>Animated background (dark)</h3>
       <div class="test-card dark">
         <weather-forecast-card id="test-card-8"></weather-forecast-card>
       </div>
+      <h3>Weather attributes</h3>
+      <div class="test-card">
+        <weather-forecast-card id="test-card-9"></weather-forecast-card>
+      </div>
       <h2>Bug fixes</h2>
       <h3>#14</h3>
       <div class="test-card">
@@ -94,11 +98,11 @@ <h3>#14 - 2</h3>
     </div>
     <script type="module" src="../../src/index.ts"></script>
     <script type="module">
-      import { MockHass } from "../mocks/hass.ts";
       import {
+        MockHass,
         ISSUE_14_DAILY_FORECAST,
         ISSUE_14_DAILY_FORECAST_2,
-      } from "../mocks/test-data.ts";
+      } from "../mocks/index.ts";
 
       const initializeCard = (cardId, config, hass) => {
         const card = document.getElementById(cardId);
@@ -194,6 +198,16 @@ <h3>#14 - 2</h3>
           },
           hass
         );
+        initializeCard(
+          "test-card-9",
+          {
+            entity: "weather.demo",
+            current: {
+              show_attributes: true,
+            },
+          },
+          hass
+        );
 
         const hassIssue14 = new MockHass();
         hassIssue14.dailyForecast = ISSUE_14_DAILY_FORECAST;
diff --git a/test/current-weather-attributes.test.ts b/test/current-weather-attributes.test.ts
new file mode 100644
index 0000000..c7ff042
--- /dev/null
+++ b/test/current-weather-attributes.test.ts
@@ -0,0 +1,140 @@
+import { beforeEach, describe, expect, it } from "vitest";
+import { fixture } from "@open-wc/testing";
+import { html } from "lit";
+import { MockHass } from "./mocks/hass";
+import { ExtendedHomeAssistant } from "../src/types";
+import { WeatherEntity } from "../src/data/weather";
+
+import "../src/components/wfc-current-weather";
+import { WfcCurrentWeather } from "../src/components/wfc-current-weather";
+
+const baseConfig = {
+  type: "custom:weather-forecast-card",
+  entity: "weather.demo",
+};
+
+describe("wfc-current-weather attributes", () => {
+  let hass: ExtendedHomeAssistant;
+  let weatherEntity: WeatherEntity;
+
+  beforeEach(() => {
+    const mockHass = new MockHass();
+    hass = mockHass.getHass() as ExtendedHomeAssistant;
+
+    const original = hass.states["weather.demo"] as WeatherEntity;
+    weatherEntity = {
+      ...original,
+      attributes: {
+        ...original.attributes,
+        humidity: 40,
+        pressure: 1000,
+        wind_speed: 5,
+        wind_gust_speed: 8,
+        wind_bearing: undefined,
+        visibility: 9,
+        ozone: 200,
+        uv_index: 3,
+        dew_point: 1,
+        apparent_temperature: 2,
+        cloud_coverage: 50,
+      },
+    } as WeatherEntity;
+
+    hass.states["weather.demo"] = weatherEntity;
+  });
+
+  it("does not render attributes when config is missing", async () => {
+    const el = await fixture<WfcCurrentWeather>(
+      html`<wfc-current-weather
+        .hass=${hass}
+        .weatherEntity=${weatherEntity}
+        .config=${baseConfig}
+      ></wfc-current-weather>`
+    );
+
+    await el.updateComplete;
+
+    expect(el.querySelector("wfc-current-weather-attributes")).toBeNull();
+  });
+
+  it("renders all default attributes when enabled", async () => {
+    const el = await fixture<WfcCurrentWeather>(
+      html`<wfc-current-weather
+        .hass=${hass}
+        .weatherEntity=${weatherEntity}
+        .config=${{
+          ...baseConfig,
+          current: { show_attributes: true },
+        }}
+      ></wfc-current-weather>`
+    );
+
+    await el.updateComplete;
+
+    const attrEl = el.querySelector("wfc-current-weather-attributes");
+    expect(attrEl).not.toBeNull();
+
+    const items = attrEl?.querySelectorAll(".wfc-current-attribute");
+    expect(items?.length).toBe(10);
+
+    const labels = Array.from(
+      attrEl!.querySelectorAll(".wfc-current-attribute-name")
+    ).map((node) => node.textContent?.trim());
+
+    expect(labels).toEqual([
+      "Humidity",
+      "Pressure",
+      "Wind Speed",
+      "Wind Gust Speed",
+      "Visibility",
+      "Ozone",
+      "UV Index",
+      "Dew Point",
+      "Apparent Temperature",
+      "Cloud Coverage",
+    ]);
+
+    const values = Array.from(
+      attrEl!.querySelectorAll(".wfc-current-attribute-value")
+    ).map((node) => node.textContent?.trim());
+
+    expect(values).toEqual([
+      "40 %",
+      "1000 hPa",
+      "5 m/s",
+      "8 m/s",
+      "9 km",
+      "200 DU",
+      "3",
+      "1 °C",
+      "2 °C",
+      "50 %",
+    ]);
+  });
+
+  it("respects attribute list when string provided", async () => {
+    const el = await fixture<WfcCurrentWeather>(
+      html`<wfc-current-weather
+        .hass=${hass}
+        .weatherEntity=${weatherEntity}
+        .config=${{
+          ...baseConfig,
+          current: { show_attributes: "wind_speed" },
+        }}
+      ></wfc-current-weather>`
+    );
+
+    await el.updateComplete;
+
+    const attrEl = el.querySelector("wfc-current-weather-attributes");
+    expect(attrEl).not.toBeNull();
+
+    const items = attrEl?.querySelectorAll(".wfc-current-attribute");
+    expect(items?.length).toBe(1);
+
+    const value = attrEl!.querySelector(
+      ".wfc-current-attribute-value"
+    )?.textContent;
+    expect(value?.trim()).toBe("5 m/s");
+  });
+});
diff --git a/test/mocks/ha-attribute-icon.ts b/test/mocks/ha-attribute-icon.ts
new file mode 100644
index 0000000..d77af96
--- /dev/null
+++ b/test/mocks/ha-attribute-icon.ts
@@ -0,0 +1,73 @@
+import { LitElement, html, TemplateResult, nothing } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { HassEntity } from "home-assistant-js-websocket";
+import type { ExtendedHomeAssistant } from "../../src/types";
+import {
+  mdiCloudPercentOutline,
+  mdiGauge,
+  mdiWeatherWindyVariant,
+  mdiWeatherWindy,
+  mdiEye,
+  mdiMolecule,
+  mdiWeatherSunnyAlert,
+  mdiWaterThermometerOutline,
+} from "@mdi/js";
+
+/**
+ * Mock component for ha-attribute-icon
+ * Renders MDI icons for weather attributes
+ */
+@customElement("ha-attribute-icon")
+export class HaAttributeIcon extends LitElement {
+  // @ts-expect-error test component
+  @property({ attribute: false }) hass!: ExtendedHomeAssistant;
+  // @ts-expect-error test component
+  @property({ attribute: false }) stateObj!: HassEntity;
+  // @ts-expect-error test component
+  @property({ attribute: false }) attribute!: string;
+  // @ts-expect-error test component
+  @property({ attribute: false }) icon!: string;
+
+  private iconMap: { [key: string]: string } = {
+    "mdi:cloud-percent-outline": mdiCloudPercentOutline,
+    "mdi:gauge": mdiGauge,
+    "mdi:weather-windy-variant": mdiWeatherWindyVariant,
+    "mdi:weather-windy": mdiWeatherWindy,
+    "mdi:eye": mdiEye,
+    "mdi:molecule": mdiMolecule,
+    "mdi:weather-sunny-alert": mdiWeatherSunnyAlert,
+    "mdi:water-thermometer-outline": mdiWaterThermometerOutline,
+    "mdi:thermometer": mdiWaterThermometerOutline,
+    "mdi:cloud-outline": mdiCloudPercentOutline,
+  };
+
+  protected createRenderRoot() {
+    return this;
+  }
+
+  protected render(): TemplateResult | typeof nothing {
+    if (!this.icon) {
+      return nothing;
+    }
+
+    const iconPath = this.iconMap[this.icon];
+    if (!iconPath) {
+      return nothing;
+    }
+
+    return html`
+      <svg
+        viewBox="0 0 24 24"
+        style="width: 24px; height: 24px; display: inline-block;"
+      >
+        <path d=${iconPath} fill="currentColor"></path>
+      </svg>
+    `;
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "ha-attribute-icon": HaAttributeIcon;
+  }
+}
diff --git a/test/mocks/hass.ts b/test/mocks/hass.ts
index a047f57..8711bd7 100644
--- a/test/mocks/hass.ts
+++ b/test/mocks/hass.ts
@@ -227,7 +227,6 @@ export class MockHass {
         currency: "",
       },
       localize: (key: string) => {
-        // Finnish weather state localizations
         const translations: Record<string, string> = {
           "component.weather.entity_component._.state.clear-night":
             "Clear night",
@@ -248,6 +247,34 @@ export class MockHass {
           "component.weather.entity_component._.state.sunny": "Sunny",
           "component.weather.entity_component._.state.windy": "Windy",
           "component.weather.entity_component._.state.windy-variant": "Windy",
+          "ui.card.weather.attributes.humidity": "Humidity",
+          "ui.card.weather.attributes.air_pressure": "Pressure",
+          "ui.card.weather.attributes.wind_speed": "Wind Speed",
+          "ui.card.weather.attributes.wind_bearing": "Wind Bearing",
+          "ui.card.weather.attributes.wind_gust_speed": "Wind Gust Speed",
+          "ui.card.weather.attributes.visibility": "Visibility",
+          "ui.card.weather.attributes.ozone": "Ozone",
+          "ui.card.weather.attributes.uv_index": "UV Index",
+          "ui.card.weather.attributes.dew_point": "Dew Point",
+          "ui.card.weather.attributes.apparent_temperature":
+            "Apparent Temperature",
+          "ui.card.weather.attributes.cloud_coverage": "Cloud Coverage",
+          "ui.card.weather.cardinal_direction.n": "N",
+          "ui.card.weather.cardinal_direction.nne": "NNE",
+          "ui.card.weather.cardinal_direction.ne": "NE",
+          "ui.card.weather.cardinal_direction.ene": "ENE",
+          "ui.card.weather.cardinal_direction.e": "E",
+          "ui.card.weather.cardinal_direction.ese": "ESE",
+          "ui.card.weather.cardinal_direction.se": "SE",
+          "ui.card.weather.cardinal_direction.sse": "SSE",
+          "ui.card.weather.cardinal_direction.s": "S",
+          "ui.card.weather.cardinal_direction.ssw": "SSW",
+          "ui.card.weather.cardinal_direction.sw": "SW",
+          "ui.card.weather.cardinal_direction.wsw": "WSW",
+          "ui.card.weather.cardinal_direction.w": "W",
+          "ui.card.weather.cardinal_direction.wnw": "WNW",
+          "ui.card.weather.cardinal_direction.nw": "NW",
+          "ui.card.weather.cardinal_direction.nnw": "NNW",
         };
 
         return translations[key] || key;
@@ -255,7 +282,6 @@ export class MockHass {
       formatEntityState: (stateObj: HassEntity) => {
         if (!stateObj) return "";
 
-        // For weather entities, return localized state
         if (stateObj.entity_id?.startsWith("weather.")) {
           const stateKey = `component.weather.entity_component._.state.${stateObj.state}`;
           const translations: Record<string, string> = {
@@ -284,6 +310,46 @@ export class MockHass {
 
         return stateObj.state;
       },
+      formatEntityAttributeValue: (stateObj: HassEntity, attribute: string) => {
+        if (!stateObj || !attribute) return "";
+
+        const value = stateObj.attributes[attribute];
+        if (value === undefined || value === null) {
+          return "";
+        }
+
+        // Simple formatting based on attribute type
+        switch (attribute) {
+          case "humidity":
+            return `${value} %`;
+          case "pressure":
+            return `${value} hPa`;
+          case "wind_speed":
+            return `${value} m/s`;
+          case "wind_gust_speed":
+            return `${value} m/s`;
+          case "wind_bearing":
+            return `${value} °`;
+          case "visibility":
+            return `${value} km`;
+          case "ozone":
+            return `${value} DU`;
+          case "uv_index":
+            return value.toString();
+          case "dew_point":
+            return `${value} °C`;
+          case "apparent_temperature":
+            return `${value} °C`;
+          case "cloud_coverage":
+            return `${value} %`;
+          default:
+            return value.toString();
+        }
+      },
+      formatEntityAttributeName: (stateObj: HassEntity, attribute: string) => {
+        // Return undefined to let the component use fallback localization
+        return undefined;
+      },
       language: "en",
       locale: {
         language: "en",
diff --git a/test/mocks/index.ts b/test/mocks/index.ts
new file mode 100644
index 0000000..72903b8
--- /dev/null
+++ b/test/mocks/index.ts
@@ -0,0 +1,3 @@
+export * from "./ha-attribute-icon";
+export * from "./hass";
+export * from "./test-data";