# Time SVG Creator — Référence

## Template 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">{{TIME}}</text>
  <text x="200" y="160" text-anchor="middle" fill="#64ffda" font-family="sans-serif" font-size="16">{{TIMEZONE}}</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">{{DATE}}</text>
</svg>
```

### Placeholders

| Placeholder | Remplacer par | Exemple |
|-------------|---------------|---------|
| `{{TIME}}` | La valeur `time` de l'entrée | `14:30:45` |
| `{{TIMEZONE}}` | La valeur `timezone` de l'entrée | `GST (UTC+4)` |
| `{{DATE}}` | Date extraite de `formatted` (10 premiers caractères) | `2026-03-12` |
| `{{FORMATTED}}` | La chaîne `formatted` complète (utilisée seulement dans le Markdown) | `2026-03-12 14:30:45 +04` |

### Specs de design

| Propriété | Valeur |
|-----------|--------|
| Dimensions | 400 x 250 px |
| Rayon des coins | 16 px |
| Arrière-plan | Dégradé linéaire : `#0a1628` → `#1a2744` (deep navy vers dark blue) |
| Titre | `#8892b0` (bleu atténué), 16px semibold |
| Affichage de l'heure | `#ffffff` (blanc), 52px bold |
| Timezone | `#64ffda` (accent teal), 16px |
| Lieu | `#ccd6f6` (bleu clair), 14px |
| Date | `#8892b0` (bleu atténué), 12px |
| Police | `sans-serif` |
| Tout le texte | Centré (`text-anchor="middle"` à x=200) |

---

## Template Markdown de sortie

```markdown
# Dubai Time Card

- **Time**: {{TIME}}
- **Timezone**: {{TIMEZONE}}
- **Date**: {{DATE}}
- **Full**: {{FORMATTED}}
- **SVG**: `agent-teams/output/dubai-time.svg`

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

---

## Chemins de sortie

| Fichier | Chemin |
|---------|--------|
| Carte SVG | `agent-teams/output/dubai-time.svg` |
| Résumé Markdown | `agent-teams/output/output.md` |
