Packs Free ComponentsWiFi Status Badge FREE

Pack style

Online

WiFi

lvgl:
  pages:
    - id: component_preview
      bg_color: 0x08142D
      bg_opa: 100%
      widgets:
        - obj:
            id: wsb_card
            x: 0
            y: 0
            width: 100
            height: 100
            scrollbar_mode: OFF
            bg_color: 0x070E1B
            bg_opa: 95%
            border_color: 0x162038
            border_width: 1
            border_opa: 20%
            radius: 12
            shadow_width: 0
            shadow_color: 0x10B981
            shadow_opa: 0%
            widgets:
              - label:
                  id: wsb_text
                  x: 10
                  y: 54
                  width: 80
                  height: 20
                  text: 'Online'
                  text_color: 0x10B981
                  text_font: montserrat_16
                  text_align: CENTER
                  long_mode: CLIP
              - label:
                  id: wsb_label
                  x: 10
                  y: 77
                  width: 80
                  height: 14
                  text: 'WiFi'
                  text_color: 0x8E9FB8
                  text_font: montserrat_10
                  text_align: CENTER
                  long_mode: CLIP

100 × 100

Presets8

Layout4

Layout

Dimensions

Width

Height

WiFi Status Badge - ESPHome LVGL Display for ESP32

Compact WiFi status chip with icon and text. Shows connection state, IP address, or signal strength. Every ESP project needs this.

Use the live preview to tweak parameters, then click Open in Designer to drop WiFi Status Badge into your project. The designer exports clean ESPHome LVGL YAML you can paste into any ESP32 firmware configuration - works with ILI9341, ST7789, ST7796, GC9A01 and other supported displays.

Related: wifi, status, badge, chip, signal, connection, ip, compact.

Available in Free Components pack

Need help with the YAML?

Step-by-step guide

Getting started with ESPHome + LVGL