diff --git a/.gitignore b/.gitignore
index 2fced0a71..0649c0c3e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -48,3 +48,6 @@ vue-stream-markdown/
 
 # Agent scratch space (reviews, test artifacts)
 scratch/
+
+# OpenCode
+.opencode/
diff --git a/packages/core/src/text/fonts.ts b/packages/core/src/text/fonts.ts
index e08728203..cada408ee 100644
--- a/packages/core/src/text/fonts.ts
+++ b/packages/core/src/text/fonts.ts
@@ -528,6 +528,7 @@ export class FontManager {
     options: FindLocalFontOptions = {}
   ): Promise<ArrayBuffer | null> {
     if (!IS_BROWSER || !window.queryLocalFonts) return null
+    if (this.localFontAccessState !== 'granted') return null
     try {
       const fonts = await window.queryLocalFonts()
       const match = chooseLocalFontMatch(fonts, family, style)
diff --git a/src/components/properties/FillSection.vue b/src/components/properties/FillSection.vue
index c7c978dc8..b40e359fc 100644
--- a/src/components/properties/FillSection.vue
+++ b/src/components/properties/FillSection.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { PropertyListRoot, useFillControls, useOkHCL, useI18n } from '@open-pencil/vue'
+import { PropertyListRoot, useFillControls, useOkHCL, useI18n, inputValue } from '@open-pencil/vue'
+import { colorToHexRaw, parseColor } from '@open-pencil/core/color'
 
 import FillPicker from '@/components/FillPicker.vue'
 import Tip from '@/components/ui/Tip.vue'
@@ -31,6 +32,19 @@ function updateFill(
   }
   update(index, fill)
 }
+
+function updateFillHex(
+  activeNode: SceneNode | null | undefined,
+  index: number,
+  fill: Fill,
+  hex: string,
+  update: (index: number, fill: Fill) => void
+) {
+  if (fill.type !== 'SOLID') return
+  const parsed = parseColor(hex.startsWith('#') ? hex : `#${hex}`)
+  if (!parsed) return
+  updateFill(activeNode, index, { ...fill, color: { ...parsed, a: fill.color.a } }, update)
+}
 </script>
 
 <template>
@@ -80,7 +94,18 @@ function updateFill(
           @update="updateFill(activeNode, i, $event, actions.update)"
         />
 
+        <input
+          v-if="
+            fill.type === 'SOLID' && !(activeNode && fillCtx.getBoundVariable(activeNode.id, i))
+          "
+          data-test-id="fill-hex-input"
+          class="min-w-0 flex-1 border-none bg-transparent font-mono text-xs text-surface outline-none"
+          :value="colorToHexRaw(fill.color)"
+          maxlength="6"
+          @change="updateFillHex(activeNode, i, fill, inputValue($event), actions.update)"
+        />
         <span
+          v-else
           class="min-w-0 flex-1 truncate font-mono text-xs"
           :class="
             activeNode && fillCtx.getBoundVariable(activeNode.id, i)