diff --git a/frontend/src/tabs/weather/components/WeatherView.tsx b/frontend/src/tabs/weather/components/WeatherView.tsx
index 3619fe2..1fe5088 100755
--- a/frontend/src/tabs/weather/components/WeatherView.tsx
+++ b/frontend/src/tabs/weather/components/WeatherView.tsx
@@ -371,88 +371,63 @@ export function WeatherView() {
           </Map>
 
           {/* 레이어 컨트롤 */}
-          <div className="absolute top-6 left-6 bg-bg-1/90 border border-border rounded-lg p-4 backdrop-blur-sm z-10">
-            <div className="text-sm font-semibold text-text-1 mb-3">기상 레이어</div>
-            <div className="space-y-2">
-              <label className="flex items-center gap-2 cursor-pointer">
+          <div className="absolute top-4 left-4 bg-bg-1/85 border border-border rounded-md backdrop-blur-sm z-10" style={{ padding: '6px 10px' }}>
+            <div className="text-[9px] font-semibold text-text-1 mb-1.5 font-korean">기상 레이어</div>
+            <div className="flex flex-col gap-1">
+              <label className="flex items-center gap-1.5 cursor-pointer">
                 <input
                   type="checkbox"
                   checked={enabledLayers.has('windParticle')}
                   onChange={() => toggleLayer('windParticle')}
-                  className="w-4 h-4 rounded border-border bg-bg-2 text-primary-cyan focus:ring-primary-cyan"
+                  className="w-3 h-3 rounded border-border bg-bg-2 text-primary-cyan accent-[var(--cyan)]"
                 />
-                <span className="text-xs text-text-2">🌬️ 바람 흐름</span>
+                <span className="text-[9px] text-text-2">🌬️ 바람 흐름</span>
               </label>
-              <label className="flex items-center gap-2 cursor-pointer">
+              <label className="flex items-center gap-1.5 cursor-pointer">
                 <input
                   type="checkbox"
                   checked={enabledLayers.has('wind')}
                   onChange={() => toggleLayer('wind')}
-                  className="w-4 h-4 rounded border-border bg-bg-2 text-primary-cyan focus:ring-primary-cyan"
+                  className="w-3 h-3 rounded border-border bg-bg-2 text-primary-cyan accent-[var(--cyan)]"
                 />
-                <span className="text-xs text-text-2">🌬️ 바람 벡터</span>
+                <span className="text-[9px] text-text-2">🌬️ 바람 벡터</span>
               </label>
-              {/* 기상 데이터 레이어 — 임시 비활성화
-              <label className="flex items-center gap-2 cursor-pointer">
-                <input
-                  type="checkbox"
-                  checked={enabledLayers.has('labels')}
-                  onChange={() => toggleLayer('labels')}
-                  className="w-4 h-4 rounded border-border bg-bg-2 text-primary-cyan focus:ring-primary-cyan"
-                />
-                <span className="text-xs text-text-2">📊 기상 데이터</span>
-              </label>
-              */}
-              <label className="flex items-center gap-2 cursor-pointer">
+              <label className="flex items-center gap-1.5 cursor-pointer">
                 <input
                   type="checkbox"
                   checked={enabledLayers.has('waves')}
                   onChange={() => toggleLayer('waves')}
-                  className="w-4 h-4 rounded border-border bg-bg-2 text-primary-cyan focus:ring-primary-cyan"
+                  className="w-3 h-3 rounded border-border bg-bg-2 text-primary-cyan accent-[var(--cyan)]"
                 />
-                <span className="text-xs text-text-2">🌊 파고 분포</span>
+                <span className="text-[9px] text-text-2">🌊 파고 분포</span>
               </label>
-              <label className="flex items-center gap-2 cursor-pointer">
+              <label className="flex items-center gap-1.5 cursor-pointer">
                 <input
                   type="checkbox"
                   checked={enabledLayers.has('temperature')}
                   onChange={() => toggleLayer('temperature')}
-                  className="w-4 h-4 rounded border-border bg-bg-2 text-primary-cyan focus:ring-primary-cyan"
+                  className="w-3 h-3 rounded border-border bg-bg-2 text-primary-cyan accent-[var(--cyan)]"
                 />
-                <span className="text-xs text-text-2">🌡️ 수온 분포</span>
+                <span className="text-[9px] text-text-2">🌡️ 수온 분포</span>
               </label>
-              <label className="flex items-center gap-2 cursor-pointer">
+              <label className="flex items-center gap-1.5 cursor-pointer">
                 <input
                   type="checkbox"
                   checked={enabledLayers.has('oceanCurrentParticle')}
                   onChange={() => toggleLayer('oceanCurrentParticle')}
-                  className="w-4 h-4 rounded border-border bg-bg-2 text-primary-cyan focus:ring-primary-cyan"
+                  className="w-3 h-3 rounded border-border bg-bg-2 text-primary-cyan accent-[var(--cyan)]"
                 />
-                <span className="text-xs text-text-2">🌊 해류 흐름</span>
+                <span className="text-[9px] text-text-2">🌊 해류 흐름</span>
               </label>
-              <label className="flex items-center gap-2 cursor-pointer">
+              <label className="flex items-center gap-1.5 cursor-pointer">
                 <input
                   type="checkbox"
                   checked={enabledLayers.has('waterTemperature')}
                   onChange={() => toggleLayer('waterTemperature')}
-                  className="w-4 h-4 rounded border-border bg-bg-2 text-primary-cyan focus:ring-primary-cyan"
+                  className="w-3 h-3 rounded border-border bg-bg-2 text-primary-cyan accent-[var(--cyan)]"
                 />
-                <span className="text-xs text-text-2">🌡️ 수온 색상도</span>
+                <span className="text-[9px] text-text-2">🌡️ 수온 색상도</span>
               </label>
-
-              {/* 해황예보도 레이어 — 임시 비활성화
-              <div className="pt-2 mt-2 border-t border-border">
-                <label className="flex items-center gap-2 cursor-pointer">
-                  <input
-                    type="checkbox"
-                    checked={enabledLayers.has('oceanForecast')}
-                    onChange={() => toggleLayer('oceanForecast')}
-                    className="w-4 h-4 rounded border-border bg-bg-2 text-primary-cyan focus:ring-primary-cyan"
-                  />
-                  <span className="text-xs text-text-2">🌊 해황예보도</span>
-                </label>
-              </div>
-              */}
             </div>
           </div>