mirror of
https://github.com/clucraft/PriceGhost.git
synced 2026-04-25 00:36:32 +02:00
Add ghostly header SVG for README
- Combined icon + PriceGhost text in single SVG header - Ghost text has gradient fade effect (solid to transparent) - Subtle glow filter for ethereal look - Replaces separate icon and h1 in README Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
25936f4c9d
commit
b8c3b80db7
2 changed files with 47 additions and 3 deletions
46
assets/header.svg
Normal file
46
assets/header.svg
Normal file
|
|
@ -0,0 +1,46 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 120">
|
||||
<defs>
|
||||
<!-- Ghost icon gradient -->
|
||||
<linearGradient id="ghostGrad" x1="0%" y1="0%" x2="0%" y2="100%">
|
||||
<stop offset="0%" style="stop-color:#818cf8"/>
|
||||
<stop offset="100%" style="stop-color:#6366f1"/>
|
||||
</linearGradient>
|
||||
<!-- Text fade gradient for "Ghost" -->
|
||||
<linearGradient id="textFade" x1="0%" y1="0%" x2="100%" y2="0%">
|
||||
<stop offset="0%" style="stop-color:#1f2937"/>
|
||||
<stop offset="30%" style="stop-color:#1f2937"/>
|
||||
<stop offset="100%" style="stop-color:#1f2937;stop-opacity:0"/>
|
||||
</linearGradient>
|
||||
<!-- Glow filter -->
|
||||
<filter id="glow" x="-20%" y="-20%" width="140%" height="140%">
|
||||
<feGaussianBlur stdDeviation="2" result="coloredBlur"/>
|
||||
<feMerge>
|
||||
<feMergeNode in="coloredBlur"/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
|
||||
<!-- Ghost Icon (scaled down) -->
|
||||
<g transform="translate(10, 10) scale(0.195)">
|
||||
<!-- Background circle -->
|
||||
<circle cx="256" cy="256" r="240" fill="url(#ghostGrad)"/>
|
||||
<!-- Ghost body -->
|
||||
<path d="M256 100c-70.7 0-128 57.3-128 128v120c0 8 6 14 12 14 8 0 14-8 14-20v-30c0-8 8-14 16-14s16 6 16 14v30c0 12 6 20 14 20s14-8 14-20v-30c0-8 8-14 16-14s16 6 16 14v30c0 12 6 20 14 20s14-8 14-20v-30c0-8 8-14 16-14s16 6 16 14v30c0 12 6 20 14 20 6 0 12-6 12-14V228c0-70.7-57.3-128-128-128z" fill="white" opacity="0.95"/>
|
||||
<!-- Left eye -->
|
||||
<ellipse cx="210" cy="220" rx="20" ry="24" fill="#6366f1"/>
|
||||
<!-- Right eye -->
|
||||
<ellipse cx="302" cy="220" rx="20" ry="24" fill="#6366f1"/>
|
||||
<!-- Price tag -->
|
||||
<g transform="translate(320, 120) rotate(15)">
|
||||
<rect x="0" y="0" width="60" height="40" rx="6" fill="#10b981"/>
|
||||
<text x="30" y="28" text-anchor="middle" fill="white" font-family="Arial, sans-serif" font-size="22" font-weight="bold">$</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!-- "Price" text - solid -->
|
||||
<text x="125" y="78" font-family="system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif" font-size="52" font-weight="700" fill="#1f2937">Price</text>
|
||||
|
||||
<!-- "Ghost" text - with fade effect and glow -->
|
||||
<text x="260" y="78" font-family="system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif" font-size="52" font-weight="700" fill="url(#textFade)" filter="url(#glow)">Ghost</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
Loading…
Add table
Add a link
Reference in a new issue