feat: initial prototype

2026-01-14 20:56:28 -08:00
parent daf1bfecb8
commit f393dfb359
68 changed files with 9391 additions and 12 deletions
@@ -0,0 +1,33 @@
+# Hikari Sprites
+
+Place your anime girl sprites here! Each state needs a PNG image.
+
+## Required Files
+
+| Filename | State | Description |
+|----------|-------|-------------|
+| `idle.png` | Idle | Relaxed, waiting pose |
+| `thinking.png` | Thinking | Hand on chin, contemplative |
+| `typing.png` | Typing | Hands on keyboard, focused |
+| `searching.png` | Searching | With magnifying glass or looking around |
+| `coding.png` | Coding | Intense focus, maybe with glasses |
+| `mcp.png` | MCP Tools | Magical aura, tech vibes |
+| `permission.png` | Permission | Questioning look, curious expression |
+| `success.png` | Success | Celebrating, happy! |
+| `error.png` | Error | Concerned, sympathetic |
+
+## Recommended Specs
+
+- **Size**: 512x512 pixels minimum (will be scaled down as needed)
+- **Format**: PNG with transparency
+- **Style**: Anime/manga style character
+- **Background**: Transparent
+
+## Bonus: Animation Frames
+
+For animated states, you can add numbered frames:
+- `typing_1.png`, `typing_2.png`, `typing_3.png`
+- `thinking_1.png`, `thinking_2.png`
+- etc.
+
+The app will cycle through frames if multiple are detected!
@@ -0,0 +1,37 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" width="200" height="200">
+  <defs>
+    <linearGradient id="bgGrad" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" style="stop-color:#e94560;stop-opacity:0.2" />
+      <stop offset="100%" style="stop-color:#ff6b9d;stop-opacity:0.2" />
+    </linearGradient>
+  </defs>
+
+  <!-- Background circle -->
+  <circle cx="100" cy="100" r="90" fill="url(#bgGrad)" stroke="#e94560" stroke-width="2"/>
+
+  <!-- Simple face outline -->
+  <ellipse cx="100" cy="85" rx="45" ry="50" fill="none" stroke="#ff6b9d" stroke-width="2"/>
+
+  <!-- Eyes -->
+  <ellipse cx="80" cy="75" rx="8" ry="10" fill="#e94560"/>
+  <ellipse cx="120" cy="75" rx="8" ry="10" fill="#e94560"/>
+  <circle cx="82" cy="73" r="3" fill="white"/>
+  <circle cx="122" cy="73" r="3" fill="white"/>
+
+  <!-- Smile -->
+  <path d="M 80 100 Q 100 115 120 100" fill="none" stroke="#e94560" stroke-width="2" stroke-linecap="round"/>
+
+  <!-- Hair outline -->
+  <path d="M 55 60 Q 50 30 100 25 Q 150 30 145 60" fill="none" stroke="#ff6b9d" stroke-width="2"/>
+  <path d="M 55 60 Q 45 80 50 100" fill="none" stroke="#ff6b9d" stroke-width="2"/>
+  <path d="M 145 60 Q 155 80 150 100" fill="none" stroke="#ff6b9d" stroke-width="2"/>
+
+  <!-- Sparkles -->
+  <text x="40" y="50" font-size="16">✨</text>
+  <text x="150" y="50" font-size="16">✨</text>
+
+  <!-- Text -->
+  <text x="100" y="170" text-anchor="middle" font-family="sans-serif" font-size="12" fill="#a0a0a0">
+    Add your sprite!
+  </text>
+</svg>