From 76e1af8e97c6466b3fb936d5949bd68d187bd128 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebastian=20Kr=C3=BCger?= <valknar@pivoine.art>
Date: Sun, 9 Nov 2025 13:15:12 +0100
Subject: [PATCH] feat: add Figlet ASCII art generator as 7th tool
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Added Figlet tool with 373 fonts for ASCII art text generation
- Created new gradient-yellow-amber for terminal/retro aesthetic
- Updated Stats component from 6 to 7 tools
- Updated Footer badge to 7 tools and added Figlet link
- Added Figlet to README Available Tools section

Figlet Features:
- 373 curated fonts from xero/figlet-fonts collection
- Live preview and fuzzy search
- Multiple export formats (text, PNG, SVG, code snippets)
- Shareable URLs and keyboard shortcuts
- Perfect for ASCII banners, terminal art, and retro designs

Color: Yellow (#eab308) to Amber (#f59e0b) gradient
URL: https://figlet.kit.pivoine.art

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 README.md                |  1 +
 app/globals.css          |  4 ++++
 components/Footer.tsx    |  3 ++-
 components/Stats.tsx     |  2 +-
 components/ToolsGrid.tsx | 14 ++++++++++++++
 5 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 97a3d58..6820879 100644
--- a/README.md
+++ b/README.md
@@ -137,6 +137,7 @@ Tailwind CSS 4 uses a new CSS-first configuration approach:
 - **Stirling** - Powerful PDF toolkit with 50+ operations (merge, split, convert, OCR, sign)
 - **Units** - Smart unit converter with 187 units across 23 categories (length, mass, temperature, etc.)
 - **Draw** - Virtual whiteboard for sketching hand-drawn style diagrams (flowcharts, wireframes, collaborative editing)
+- **Figlet** - ASCII art text generator with 373 fonts (text banners, terminal art, retro designs)
 
 ## CI/CD Pipeline
 
diff --git a/app/globals.css b/app/globals.css
index f10d70b..49a07df 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -102,3 +102,7 @@ body {
 @utility gradient-indigo-purple {
   background: linear-gradient(135deg, #6366f1 0%, #a855f7 100%);
 }
+
+@utility gradient-yellow-amber {
+  background: linear-gradient(135deg, #eab308 0%, #f59e0b 100%);
+}
diff --git a/components/Footer.tsx b/components/Footer.tsx
index 0754911..5196336 100644
--- a/components/Footer.tsx
+++ b/components/Footer.tsx
@@ -24,7 +24,7 @@ export default function Footer() {
               Your Creative Toolkit
             </p>
             <div className="mt-4 inline-flex items-center gap-2 px-3 py-1 rounded-full bg-purple-500/10 border border-purple-500/20">
-              <span className="text-xs font-medium text-purple-400">6 Tools</span>
+              <span className="text-xs font-medium text-purple-400">7 Tools</span>
               <span className="text-gray-600">•</span>
               <span className="text-xs text-gray-500">Open Source</span>
             </div>
@@ -66,6 +66,7 @@ export default function Footer() {
               <a href="https://stirling.kit.pivoine.art" className="text-gray-400 hover:text-[#667eea] transition-colors text-base">Stirling</a>
               <a href="https://units.kit.pivoine.art" className="text-gray-400 hover:text-[#2dd4bf] transition-colors text-base">Units</a>
               <a href="https://draw.kit.pivoine.art" className="text-gray-400 hover:text-[#ec4899] transition-colors text-base">Draw</a>
+              <a href="https://figlet.kit.pivoine.art" className="text-gray-400 hover:text-[#eab308] transition-colors text-base">Figlet</a>
             </div>
           </div>
         </motion.div>
diff --git a/components/Stats.tsx b/components/Stats.tsx
index 310ae83..fc641a4 100644
--- a/components/Stats.tsx
+++ b/components/Stats.tsx
@@ -4,7 +4,7 @@ import { motion } from 'framer-motion';
 
 const stats = [
   {
-    number: '6',
+    number: '7',
     label: 'Tools',
     icon: (
       <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
diff --git a/components/ToolsGrid.tsx b/components/ToolsGrid.tsx
index 0429cc3..45e641f 100644
--- a/components/ToolsGrid.tsx
+++ b/components/ToolsGrid.tsx
@@ -86,6 +86,20 @@ const tools = [
       </svg>
     ),
   },
+  {
+    title: 'Figlet',
+    description: 'ASCII art text generator with 373 fonts. Create stunning text banners, terminal art, and retro designs with live preview and multiple export formats.',
+    url: 'https://figlet.kit.pivoine.art',
+    gradient: 'gradient-yellow-amber',
+    accentColor: '#eab308',
+    badges: ['373 Fonts', 'ASCII Art', 'Free'],
+    icon: (
+      <svg className="w-12 h-12 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
+        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 8h.01M15 8h.01" />
+      </svg>
+    ),
+  },
 ];
 
 export default function ToolsGrid() {