diff --git a/src/components/WaveformDisplay/WaveformDisplay.vue b/src/components/WaveformDisplay/WaveformDisplay.vue
index d443c08..3650595 100644
--- a/src/components/WaveformDisplay/WaveformDisplay.vue
+++ b/src/components/WaveformDisplay/WaveformDisplay.vue
@@ -123,7 +123,7 @@ const option = computed((): EChartsOption => {
   const xAxis: XAXisOption[] = [
     {
       type: "category",
-      boundaryGap: false,
+      boundaryGap: true,
       data: analyzer.logicData.value.x.map((x) => x.toFixed(3)),
       axisLabel: {
         formatter: (value: string) =>
@@ -258,6 +258,11 @@ const option = computed((): EChartsOption => {
             width: 2,
             color: channel.color,
           },
+          areaStyle: {
+            opacity: 0.3,
+            origin: displayIndex * channelSpacing + 0.5,
+            color: channel.color,
+          },
           symbol: "none",
           sampling: "lttb",
           animation: false,
@@ -283,6 +288,11 @@ const option = computed((): EChartsOption => {
             width: 2,
             color: channel.color,
           },
+          areaStyle: {
+            opacity: 0.3,
+            origin: displayIndex * channelSpacing + 0.5,
+            color: channel.color,
+          },
           symbol: "none",
           sampling: "lttb",
           animation: false,