valknar/kit-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
a37b0e5b088765e44225ef8a8431dcf76916613e
kit-ui/app/icon.svg

67 lines
2.4 KiB
XML
Raw Normal View History

polish: Priority 1 improvements - gradients, stats, metadata, footer ✨ Visual Enhancements: - Unique gradients per tool (green-teal for Vert, orange-pink for Paint, indigo-purple for Pastel) - Added new gradient utilities for better color differentiation 📊 Stats Section: - New animated stats component showing "3 Tools, 100% Open Source, ∞ Privacy First" - Glassmorphism cards with hover effects - Icon badges for each stat 🔍 Enhanced Metadata: - Comprehensive Open Graph tags for social sharing - Twitter Card support - Enhanced SEO with detailed keywords (vert, paint, pastel) - Added SVG favicon with gradient toolbox icon - Viewport meta tag and preconnect optimization 🔗 Improved Footer: - 3-column responsive layout - GitHub repository link with icon - Quick links to all tools (Vert, Paint, Pastel) - Tool count badge - Updated tech stack mention (Next.js 16 & Tailwind CSS 4) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-07 12:30:08 +01:00
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
design: use authentic Lucide icons (brush × wrench) crossed Logo Update: - Using official Lucide SVG paths for brush and wrench icons - Crossed in X formation (45° and -45° rotation) - Professional, recognizable design from established icon library Icon Details: - Wrench (Lucide): Purple gradient (#667eea → #a855f7) - Brush (Lucide): Orange-to-pink gradient (#f59e0b → #ec4899) - Brush bristles: Green-cyan fill with transparency - Center circle: Purple-to-cyan gradient accent Animations: - Wrench draws in with path animation - Brush draws in with delay - Center circle pops in with spring effect - Smooth, professional entrance Favicon: - Matching crossed Lucide icons for 64x64 - Scaled appropriately for small sizes - Dark background with gradient icons Benefits: - Authentic, recognizable icons from Lucide library - Professional design language - Consistent with modern UI/UX standards - Clear symbolism: utility (wrench) + creativity (brush) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:56:57 +01:00
<!-- Background -->
<rect width="64" height="64" rx="12" fill="url(#bg)"/>
design: simplify logo to suitcase with single brush Logo Redesign: - Simplified from toolbox with 3 tools to clean suitcase with 1 brush - Purple gradient suitcase with handle and latch detail - Single colorful brush inside (orange-to-red handle, green-to-cyan bristles) - Smoother animations with reduced complexity - Better visual clarity and brand identity Favicon Update: - Matching simplified design scaled for 64x64 - Clear icon that works at small sizes - Consistent with main logo design Visual Elements: - Suitcase: Purple (#a855f7) to Indigo (#6366f1) gradient - Brush handle: Orange (#f59e0b) to Red (#ef4444) gradient - Brush bristles: Green (#10b981) to Cyan (#06b6d4) gradient - Animated entrance with subtle scale and fade 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-08 19:20:39 +01:00
design: use authentic Lucide icons (brush × wrench) crossed Logo Update: - Using official Lucide SVG paths for brush and wrench icons - Crossed in X formation (45° and -45° rotation) - Professional, recognizable design from established icon library Icon Details: - Wrench (Lucide): Purple gradient (#667eea → #a855f7) - Brush (Lucide): Orange-to-pink gradient (#f59e0b → #ec4899) - Brush bristles: Green-cyan fill with transparency - Center circle: Purple-to-cyan gradient accent Animations: - Wrench draws in with path animation - Brush draws in with delay - Center circle pops in with spring effect - Smooth, professional entrance Favicon: - Matching crossed Lucide icons for 64x64 - Scaled appropriately for small sizes - Dark background with gradient icons Benefits: - Authentic, recognizable icons from Lucide library - Professional design language - Consistent with modern UI/UX standards - Clear symbolism: utility (wrench) + creativity (brush) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:56:57 +01:00
<!-- Wrench (Lucide) - rotated 45 degrees -->
<g transform="translate(32, 32) rotate(45) scale(1.8) translate(-12, -12)">
design: redesign logo with clean Lucide-style icons Logo Redesign: - Clean, minimal circular badge design - Beautiful gradient background (indigo → purple → cyan) - White outlined icons in Lucide/Heroicons style - Wrench and paintbrush side-by-side - Professional and modern aesthetic Icon Design: - Wrench: Simple outline with open-end head - Paintbrush: Clean brush with bristles and handle - Both icons use consistent 6px stroke width - Smooth entrance animations (slide in from sides) Favicon Update: - Matching circular badge design for 64x64 - Clear visibility at small sizes - Consistent white icons on gradient background - Professional brand identity Colors: - Background gradient: #667eea → #8b5cf6 → #06b6d4 - Icons: Pure white (#ffffff) for maximum contrast - Clean, modern, accessible design Animations: - Background circle scales in - Wrench slides in from left - Paintbrush slides in from right - Smooth, subtle entrance effects 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:54:15 +01:00
<path
design: use authentic Lucide icons (brush × wrench) crossed Logo Update: - Using official Lucide SVG paths for brush and wrench icons - Crossed in X formation (45° and -45° rotation) - Professional, recognizable design from established icon library Icon Details: - Wrench (Lucide): Purple gradient (#667eea → #a855f7) - Brush (Lucide): Orange-to-pink gradient (#f59e0b → #ec4899) - Brush bristles: Green-cyan fill with transparency - Center circle: Purple-to-cyan gradient accent Animations: - Wrench draws in with path animation - Brush draws in with delay - Center circle pops in with spring effect - Smooth, professional entrance Favicon: - Matching crossed Lucide icons for 64x64 - Scaled appropriately for small sizes - Dark background with gradient icons Benefits: - Authentic, recognizable icons from Lucide library - Professional design language - Consistent with modern UI/UX standards - Clear symbolism: utility (wrench) + creativity (brush) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:56:57 +01:00
d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z"
stroke="url(#wrench)"
stroke-width="1.5"
design: redesign logo with clean Lucide-style icons Logo Redesign: - Clean, minimal circular badge design - Beautiful gradient background (indigo → purple → cyan) - White outlined icons in Lucide/Heroicons style - Wrench and paintbrush side-by-side - Professional and modern aesthetic Icon Design: - Wrench: Simple outline with open-end head - Paintbrush: Clean brush with bristles and handle - Both icons use consistent 6px stroke width - Smooth entrance animations (slide in from sides) Favicon Update: - Matching circular badge design for 64x64 - Clear visibility at small sizes - Consistent white icons on gradient background - Professional brand identity Colors: - Background gradient: #667eea → #8b5cf6 → #06b6d4 - Icons: Pure white (#ffffff) for maximum contrast - Clean, modern, accessible design Animations: - Background circle scales in - Wrench slides in from left - Paintbrush slides in from right - Smooth, subtle entrance effects 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:54:15 +01:00
stroke-linecap="round"
stroke-linejoin="round"
design: use authentic Lucide icons (brush × wrench) crossed Logo Update: - Using official Lucide SVG paths for brush and wrench icons - Crossed in X formation (45° and -45° rotation) - Professional, recognizable design from established icon library Icon Details: - Wrench (Lucide): Purple gradient (#667eea → #a855f7) - Brush (Lucide): Orange-to-pink gradient (#f59e0b → #ec4899) - Brush bristles: Green-cyan fill with transparency - Center circle: Purple-to-cyan gradient accent Animations: - Wrench draws in with path animation - Brush draws in with delay - Center circle pops in with spring effect - Smooth, professional entrance Favicon: - Matching crossed Lucide icons for 64x64 - Scaled appropriately for small sizes - Dark background with gradient icons Benefits: - Authentic, recognizable icons from Lucide library - Professional design language - Consistent with modern UI/UX standards - Clear symbolism: utility (wrench) + creativity (brush) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:56:57 +01:00
fill="none"
vector-effect="non-scaling-stroke"
design: redesign logo with clean Lucide-style icons Logo Redesign: - Clean, minimal circular badge design - Beautiful gradient background (indigo → purple → cyan) - White outlined icons in Lucide/Heroicons style - Wrench and paintbrush side-by-side - Professional and modern aesthetic Icon Design: - Wrench: Simple outline with open-end head - Paintbrush: Clean brush with bristles and handle - Both icons use consistent 6px stroke width - Smooth entrance animations (slide in from sides) Favicon Update: - Matching circular badge design for 64x64 - Clear visibility at small sizes - Consistent white icons on gradient background - Professional brand identity Colors: - Background gradient: #667eea → #8b5cf6 → #06b6d4 - Icons: Pure white (#ffffff) for maximum contrast - Clean, modern, accessible design Animations: - Background circle scales in - Wrench slides in from left - Paintbrush slides in from right - Smooth, subtle entrance effects 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:54:15 +01:00
/>
design: update logo to crossed wrench and brush Logo Redesign: - Simple, beautiful crossed design (wrench × brush in X formation) - Wrench: Bottom-left to top-right with purple gradient - Brush: Top-left to bottom-right with orange-red gradient - Center circle at intersection with purple-to-cyan gradient - Clean, minimal aesthetic with smooth animations Favicon Update: - Matching crossed design scaled for 64x64 - Clear visibility at small sizes - Professional and memorable icon Visual Elements: - Wrench: Indigo (#667eea) to Purple (#a855f7) gradient - Brush handle: Amber (#f59e0b) to Red (#ef4444) gradient - Brush ferrule: Gray metal finish - Brush bristles: Green (#10b981) to Cyan (#06b6d4) gradient - Center: Purple to Cyan radial gradient Animations: - Initial rotation animation on logo - Progressive drawing of wrench and brush - Bristles expand effect - Center circle pops in with spring animation 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:49:32 +01:00
</g>
design: simplify logo to suitcase with single brush Logo Redesign: - Simplified from toolbox with 3 tools to clean suitcase with 1 brush - Purple gradient suitcase with handle and latch detail - Single colorful brush inside (orange-to-red handle, green-to-cyan bristles) - Smoother animations with reduced complexity - Better visual clarity and brand identity Favicon Update: - Matching simplified design scaled for 64x64 - Clear icon that works at small sizes - Consistent with main logo design Visual Elements: - Suitcase: Purple (#a855f7) to Indigo (#6366f1) gradient - Brush handle: Orange (#f59e0b) to Red (#ef4444) gradient - Brush bristles: Green (#10b981) to Cyan (#06b6d4) gradient - Animated entrance with subtle scale and fade 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-08 19:20:39 +01:00
design: use authentic Lucide icons (brush × wrench) crossed Logo Update: - Using official Lucide SVG paths for brush and wrench icons - Crossed in X formation (45° and -45° rotation) - Professional, recognizable design from established icon library Icon Details: - Wrench (Lucide): Purple gradient (#667eea → #a855f7) - Brush (Lucide): Orange-to-pink gradient (#f59e0b → #ec4899) - Brush bristles: Green-cyan fill with transparency - Center circle: Purple-to-cyan gradient accent Animations: - Wrench draws in with path animation - Brush draws in with delay - Center circle pops in with spring effect - Smooth, professional entrance Favicon: - Matching crossed Lucide icons for 64x64 - Scaled appropriately for small sizes - Dark background with gradient icons Benefits: - Authentic, recognizable icons from Lucide library - Professional design language - Consistent with modern UI/UX standards - Clear symbolism: utility (wrench) + creativity (brush) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:56:57 +01:00
<!-- Brush (Lucide) - rotated -45 degrees -->
<g transform="translate(32, 32) rotate(-45) scale(1.8) translate(-12, -12)">
design: redesign logo with clean Lucide-style icons Logo Redesign: - Clean, minimal circular badge design - Beautiful gradient background (indigo → purple → cyan) - White outlined icons in Lucide/Heroicons style - Wrench and paintbrush side-by-side - Professional and modern aesthetic Icon Design: - Wrench: Simple outline with open-end head - Paintbrush: Clean brush with bristles and handle - Both icons use consistent 6px stroke width - Smooth entrance animations (slide in from sides) Favicon Update: - Matching circular badge design for 64x64 - Clear visibility at small sizes - Consistent white icons on gradient background - Professional brand identity Colors: - Background gradient: #667eea → #8b5cf6 → #06b6d4 - Icons: Pure white (#ffffff) for maximum contrast - Clean, modern, accessible design Animations: - Background circle scales in - Wrench slides in from left - Paintbrush slides in from right - Smooth, subtle entrance effects 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:54:15 +01:00
<path
design: use authentic Lucide icons (brush × wrench) crossed Logo Update: - Using official Lucide SVG paths for brush and wrench icons - Crossed in X formation (45° and -45° rotation) - Professional, recognizable design from established icon library Icon Details: - Wrench (Lucide): Purple gradient (#667eea → #a855f7) - Brush (Lucide): Orange-to-pink gradient (#f59e0b → #ec4899) - Brush bristles: Green-cyan fill with transparency - Center circle: Purple-to-cyan gradient accent Animations: - Wrench draws in with path animation - Brush draws in with delay - Center circle pops in with spring effect - Smooth, professional entrance Favicon: - Matching crossed Lucide icons for 64x64 - Scaled appropriately for small sizes - Dark background with gradient icons Benefits: - Authentic, recognizable icons from Lucide library - Professional design language - Consistent with modern UI/UX standards - Clear symbolism: utility (wrench) + creativity (brush) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:56:57 +01:00
d="m9.06 11.9 8.07-8.06a2.85 2.85 0 1 1 4.03 4.03l-8.06 8.08"
stroke="url(#brush)"
stroke-width="1.5"
design: redesign logo with clean Lucide-style icons Logo Redesign: - Clean, minimal circular badge design - Beautiful gradient background (indigo → purple → cyan) - White outlined icons in Lucide/Heroicons style - Wrench and paintbrush side-by-side - Professional and modern aesthetic Icon Design: - Wrench: Simple outline with open-end head - Paintbrush: Clean brush with bristles and handle - Both icons use consistent 6px stroke width - Smooth entrance animations (slide in from sides) Favicon Update: - Matching circular badge design for 64x64 - Clear visibility at small sizes - Consistent white icons on gradient background - Professional brand identity Colors: - Background gradient: #667eea → #8b5cf6 → #06b6d4 - Icons: Pure white (#ffffff) for maximum contrast - Clean, modern, accessible design Animations: - Background circle scales in - Wrench slides in from left - Paintbrush slides in from right - Smooth, subtle entrance effects 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:54:15 +01:00
stroke-linecap="round"
stroke-linejoin="round"
fill="none"
design: use authentic Lucide icons (brush × wrench) crossed Logo Update: - Using official Lucide SVG paths for brush and wrench icons - Crossed in X formation (45° and -45° rotation) - Professional, recognizable design from established icon library Icon Details: - Wrench (Lucide): Purple gradient (#667eea → #a855f7) - Brush (Lucide): Orange-to-pink gradient (#f59e0b → #ec4899) - Brush bristles: Green-cyan fill with transparency - Center circle: Purple-to-cyan gradient accent Animations: - Wrench draws in with path animation - Brush draws in with delay - Center circle pops in with spring effect - Smooth, professional entrance Favicon: - Matching crossed Lucide icons for 64x64 - Scaled appropriately for small sizes - Dark background with gradient icons Benefits: - Authentic, recognizable icons from Lucide library - Professional design language - Consistent with modern UI/UX standards - Clear symbolism: utility (wrench) + creativity (brush) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:56:57 +01:00
vector-effect="non-scaling-stroke"
/>
<path
d="M7.07 14.94c-1.66 0-3 1.35-3 3.02 0 1.33-2.5 1.52-2 2.02 1.08 1.1 2.49 2.02 4 2.02 2.2 0 4-1.8 4-4.04a3.01 3.01 0 0 0-3-3.02z"
stroke="url(#brush)"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
fill="url(#brushFill)"
vector-effect="non-scaling-stroke"
design: redesign logo with clean Lucide-style icons Logo Redesign: - Clean, minimal circular badge design - Beautiful gradient background (indigo → purple → cyan) - White outlined icons in Lucide/Heroicons style - Wrench and paintbrush side-by-side - Professional and modern aesthetic Icon Design: - Wrench: Simple outline with open-end head - Paintbrush: Clean brush with bristles and handle - Both icons use consistent 6px stroke width - Smooth entrance animations (slide in from sides) Favicon Update: - Matching circular badge design for 64x64 - Clear visibility at small sizes - Consistent white icons on gradient background - Professional brand identity Colors: - Background gradient: #667eea → #8b5cf6 → #06b6d4 - Icons: Pure white (#ffffff) for maximum contrast - Clean, modern, accessible design Animations: - Background circle scales in - Wrench slides in from left - Paintbrush slides in from right - Smooth, subtle entrance effects 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:54:15 +01:00
/>
design: update logo to crossed wrench and brush Logo Redesign: - Simple, beautiful crossed design (wrench × brush in X formation) - Wrench: Bottom-left to top-right with purple gradient - Brush: Top-left to bottom-right with orange-red gradient - Center circle at intersection with purple-to-cyan gradient - Clean, minimal aesthetic with smooth animations Favicon Update: - Matching crossed design scaled for 64x64 - Clear visibility at small sizes - Professional and memorable icon Visual Elements: - Wrench: Indigo (#667eea) to Purple (#a855f7) gradient - Brush handle: Amber (#f59e0b) to Red (#ef4444) gradient - Brush ferrule: Gray metal finish - Brush bristles: Green (#10b981) to Cyan (#06b6d4) gradient - Center: Purple to Cyan radial gradient Animations: - Initial rotation animation on logo - Progressive drawing of wrench and brush - Bristles expand effect - Center circle pops in with spring animation 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:49:32 +01:00
</g>
design: simplify logo to suitcase with single brush Logo Redesign: - Simplified from toolbox with 3 tools to clean suitcase with 1 brush - Purple gradient suitcase with handle and latch detail - Single colorful brush inside (orange-to-red handle, green-to-cyan bristles) - Smoother animations with reduced complexity - Better visual clarity and brand identity Favicon Update: - Matching simplified design scaled for 64x64 - Clear icon that works at small sizes - Consistent with main logo design Visual Elements: - Suitcase: Purple (#a855f7) to Indigo (#6366f1) gradient - Brush handle: Orange (#f59e0b) to Red (#ef4444) gradient - Brush bristles: Green (#10b981) to Cyan (#06b6d4) gradient - Animated entrance with subtle scale and fade 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-08 19:20:39 +01:00
design: use authentic Lucide icons (brush × wrench) crossed Logo Update: - Using official Lucide SVG paths for brush and wrench icons - Crossed in X formation (45° and -45° rotation) - Professional, recognizable design from established icon library Icon Details: - Wrench (Lucide): Purple gradient (#667eea → #a855f7) - Brush (Lucide): Orange-to-pink gradient (#f59e0b → #ec4899) - Brush bristles: Green-cyan fill with transparency - Center circle: Purple-to-cyan gradient accent Animations: - Wrench draws in with path animation - Brush draws in with delay - Center circle pops in with spring effect - Smooth, professional entrance Favicon: - Matching crossed Lucide icons for 64x64 - Scaled appropriately for small sizes - Dark background with gradient icons Benefits: - Authentic, recognizable icons from Lucide library - Professional design language - Consistent with modern UI/UX standards - Clear symbolism: utility (wrench) + creativity (brush) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:56:57 +01:00
<!-- Center circle -->
<circle cx="32" cy="32" r="3" fill="url(#center)"/>
design: simplify logo to suitcase with single brush Logo Redesign: - Simplified from toolbox with 3 tools to clean suitcase with 1 brush - Purple gradient suitcase with handle and latch detail - Single colorful brush inside (orange-to-red handle, green-to-cyan bristles) - Smoother animations with reduced complexity - Better visual clarity and brand identity Favicon Update: - Matching simplified design scaled for 64x64 - Clear icon that works at small sizes - Consistent with main logo design Visual Elements: - Suitcase: Purple (#a855f7) to Indigo (#6366f1) gradient - Brush handle: Orange (#f59e0b) to Red (#ef4444) gradient - Brush bristles: Green (#10b981) to Cyan (#06b6d4) gradient - Animated entrance with subtle scale and fade 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-08 19:20:39 +01:00
<!-- Gradients -->
polish: Priority 1 improvements - gradients, stats, metadata, footer ✨ Visual Enhancements: - Unique gradients per tool (green-teal for Vert, orange-pink for Paint, indigo-purple for Pastel) - Added new gradient utilities for better color differentiation 📊 Stats Section: - New animated stats component showing "3 Tools, 100% Open Source, ∞ Privacy First" - Glassmorphism cards with hover effects - Icon badges for each stat 🔍 Enhanced Metadata: - Comprehensive Open Graph tags for social sharing - Twitter Card support - Enhanced SEO with detailed keywords (vert, paint, pastel) - Added SVG favicon with gradient toolbox icon - Viewport meta tag and preconnect optimization 🔗 Improved Footer: - 3-column responsive layout - GitHub repository link with icon - Quick links to all tools (Vert, Paint, Pastel) - Tool count badge - Updated tech stack mention (Next.js 16 & Tailwind CSS 4) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-07 12:30:08 +01:00
<defs>
design: simplify logo to suitcase with single brush Logo Redesign: - Simplified from toolbox with 3 tools to clean suitcase with 1 brush - Purple gradient suitcase with handle and latch detail - Single colorful brush inside (orange-to-red handle, green-to-cyan bristles) - Smoother animations with reduced complexity - Better visual clarity and brand identity Favicon Update: - Matching simplified design scaled for 64x64 - Clear icon that works at small sizes - Consistent with main logo design Visual Elements: - Suitcase: Purple (#a855f7) to Indigo (#6366f1) gradient - Brush handle: Orange (#f59e0b) to Red (#ef4444) gradient - Brush bristles: Green (#10b981) to Cyan (#06b6d4) gradient - Animated entrance with subtle scale and fade 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-08 19:20:39 +01:00
<linearGradient id="bg" x1="0%" y1="0%" x2="100%" y2="100%">
design: use authentic Lucide icons (brush × wrench) crossed Logo Update: - Using official Lucide SVG paths for brush and wrench icons - Crossed in X formation (45° and -45° rotation) - Professional, recognizable design from established icon library Icon Details: - Wrench (Lucide): Purple gradient (#667eea → #a855f7) - Brush (Lucide): Orange-to-pink gradient (#f59e0b → #ec4899) - Brush bristles: Green-cyan fill with transparency - Center circle: Purple-to-cyan gradient accent Animations: - Wrench draws in with path animation - Brush draws in with delay - Center circle pops in with spring effect - Smooth, professional entrance Favicon: - Matching crossed Lucide icons for 64x64 - Scaled appropriately for small sizes - Dark background with gradient icons Benefits: - Authentic, recognizable icons from Lucide library - Professional design language - Consistent with modern UI/UX standards - Clear symbolism: utility (wrench) + creativity (brush) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:56:57 +01:00
<stop offset="0%" stop-color="#1a1a2e"/>
<stop offset="100%" stop-color="#0f0f1a"/>
</linearGradient>
<linearGradient id="wrench" x1="0%" y1="0%" x2="100%" y2="100%">
design: update logo to crossed wrench and brush Logo Redesign: - Simple, beautiful crossed design (wrench × brush in X formation) - Wrench: Bottom-left to top-right with purple gradient - Brush: Top-left to bottom-right with orange-red gradient - Center circle at intersection with purple-to-cyan gradient - Clean, minimal aesthetic with smooth animations Favicon Update: - Matching crossed design scaled for 64x64 - Clear visibility at small sizes - Professional and memorable icon Visual Elements: - Wrench: Indigo (#667eea) to Purple (#a855f7) gradient - Brush handle: Amber (#f59e0b) to Red (#ef4444) gradient - Brush ferrule: Gray metal finish - Brush bristles: Green (#10b981) to Cyan (#06b6d4) gradient - Center: Purple to Cyan radial gradient Animations: - Initial rotation animation on logo - Progressive drawing of wrench and brush - Bristles expand effect - Center circle pops in with spring animation 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:49:32 +01:00
<stop offset="0%" stop-color="#667eea"/>
design: use authentic Lucide icons (brush × wrench) crossed Logo Update: - Using official Lucide SVG paths for brush and wrench icons - Crossed in X formation (45° and -45° rotation) - Professional, recognizable design from established icon library Icon Details: - Wrench (Lucide): Purple gradient (#667eea → #a855f7) - Brush (Lucide): Orange-to-pink gradient (#f59e0b → #ec4899) - Brush bristles: Green-cyan fill with transparency - Center circle: Purple-to-cyan gradient accent Animations: - Wrench draws in with path animation - Brush draws in with delay - Center circle pops in with spring effect - Smooth, professional entrance Favicon: - Matching crossed Lucide icons for 64x64 - Scaled appropriately for small sizes - Dark background with gradient icons Benefits: - Authentic, recognizable icons from Lucide library - Professional design language - Consistent with modern UI/UX standards - Clear symbolism: utility (wrench) + creativity (brush) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:56:57 +01:00
<stop offset="100%" stop-color="#a855f7"/>
</linearGradient>
<linearGradient id="brush" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#f59e0b"/>
<stop offset="100%" stop-color="#ec4899"/>
</linearGradient>
<linearGradient id="brushFill" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#10b981" stop-opacity="0.3"/>
<stop offset="100%" stop-color="#06b6d4" stop-opacity="0.3"/>
</linearGradient>
<linearGradient id="center" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#a855f7"/>
design: update logo to crossed wrench and brush Logo Redesign: - Simple, beautiful crossed design (wrench × brush in X formation) - Wrench: Bottom-left to top-right with purple gradient - Brush: Top-left to bottom-right with orange-red gradient - Center circle at intersection with purple-to-cyan gradient - Clean, minimal aesthetic with smooth animations Favicon Update: - Matching crossed design scaled for 64x64 - Clear visibility at small sizes - Professional and memorable icon Visual Elements: - Wrench: Indigo (#667eea) to Purple (#a855f7) gradient - Brush handle: Amber (#f59e0b) to Red (#ef4444) gradient - Brush ferrule: Gray metal finish - Brush bristles: Green (#10b981) to Cyan (#06b6d4) gradient - Center: Purple to Cyan radial gradient Animations: - Initial rotation animation on logo - Progressive drawing of wrench and brush - Bristles expand effect - Center circle pops in with spring animation 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-09 15:49:32 +01:00
<stop offset="100%" stop-color="#06b6d4"/>
</linearGradient>
polish: Priority 1 improvements - gradients, stats, metadata, footer ✨ Visual Enhancements: - Unique gradients per tool (green-teal for Vert, orange-pink for Paint, indigo-purple for Pastel) - Added new gradient utilities for better color differentiation 📊 Stats Section: - New animated stats component showing "3 Tools, 100% Open Source, ∞ Privacy First" - Glassmorphism cards with hover effects - Icon badges for each stat 🔍 Enhanced Metadata: - Comprehensive Open Graph tags for social sharing - Twitter Card support - Enhanced SEO with detailed keywords (vert, paint, pastel) - Added SVG favicon with gradient toolbox icon - Viewport meta tag and preconnect optimization 🔗 Improved Footer: - 3-column responsive layout - GitHub repository link with icon - Quick links to all tools (Vert, Paint, Pastel) - Tool count badge - Updated tech stack mention (Next.js 16 & Tailwind CSS 4) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-07 12:30:08 +01:00
</defs>
</svg>
Reference in New Issue Copy Permalink