# Time SVG Creator — Examples

## Example 1: Afternoon

### Input

```
time: 14:30:45
timezone: GST (UTC+4)
formatted: 2026-03-12 14:30:45 +04
```

### SVG Output (`agent-teams/output/dubai-time.svg`)

```svg
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 250" width="400" height="250">
  <defs>
    <linearGradient id="bg" x1="0%" y1="0%" x2="0%" y2="100%">
      <stop offset="0%" style="stop-color:#0a1628"/>
      <stop offset="100%" style="stop-color:#1a2744"/>
    </linearGradient>
  </defs>
  <rect width="400" height="250" rx="16" fill="url(#bg)"/>
  <text x="200" y="50" text-anchor="middle" fill="#8892b0" font-family="sans-serif" font-size="16" font-weight="600">Dubai Time</text>
  <text x="200" y="120" text-anchor="middle" fill="#ffffff" font-family="sans-serif" font-size="52" font-weight="bold">14:30:45</text>
  <text x="200" y="160" text-anchor="middle" fill="#64ffda" font-family="sans-serif" font-size="16">GST (UTC+4)</text>
  <text x="200" y="195" text-anchor="middle" fill="#ccd6f6" font-family="sans-serif" font-size="14">Dubai, UAE</text>
  <text x="200" y="225" text-anchor="middle" fill="#8892b0" font-family="sans-serif" font-size="12">2026-03-12</text>
</svg>
```

### Markdown Output (`agent-teams/output/output.md`)

```markdown
# Dubai Time Card

- **Time**: 14:30:45
- **Timezone**: GST (UTC+4)
- **Date**: 2026-03-12
- **Full**: 2026-03-12 14:30:45 +04
- **SVG**: `agent-teams/output/dubai-time.svg`

Generated by time-svg-creator skill.
```

---

## Example 2: Morning

### Input

```
time: 08:15:02
timezone: GST (UTC+4)
formatted: 2026-03-12 08:15:02 +04
```

### SVG Output (`agent-teams/output/dubai-time.svg`)

```svg
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 250" width="400" height="250">
  <defs>
    <linearGradient id="bg" x1="0%" y1="0%" x2="0%" y2="100%">
      <stop offset="0%" style="stop-color:#0a1628"/>
      <stop offset="100%" style="stop-color:#1a2744"/>
    </linearGradient>
  </defs>
  <rect width="400" height="250" rx="16" fill="url(#bg)"/>
  <text x="200" y="50" text-anchor="middle" fill="#8892b0" font-family="sans-serif" font-size="16" font-weight="600">Dubai Time</text>
  <text x="200" y="120" text-anchor="middle" fill="#ffffff" font-family="sans-serif" font-size="52" font-weight="bold">08:15:02</text>
  <text x="200" y="160" text-anchor="middle" fill="#64ffda" font-family="sans-serif" font-size="16">GST (UTC+4)</text>
  <text x="200" y="195" text-anchor="middle" fill="#ccd6f6" font-family="sans-serif" font-size="14">Dubai, UAE</text>
  <text x="200" y="225" text-anchor="middle" fill="#8892b0" font-family="sans-serif" font-size="12">2026-03-12</text>
</svg>
```

### Markdown Output (`agent-teams/output/output.md`)

```markdown
# Dubai Time Card

- **Time**: 08:15:02
- **Timezone**: GST (UTC+4)
- **Date**: 2026-03-12
- **Full**: 2026-03-12 08:15:02 +04
- **SVG**: `agent-teams/output/dubai-time.svg`

Generated by time-svg-creator skill.
```