sookie/blog-admin-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

feat: 添加紫色系书本风格 Logo

Browse Source 
- 创建 public/logo.svg：紫色渐变书本图标，带金色书签装饰
- 更新 public/index.html：使用 SVG 作为 favicon
- 删除旧的 favicon.ico

Logo 特点：
- 圆形背景配紫色渐变（#7c3aed → #c084fc）
- 打开的书本造型，淡紫色书页
- 金色书签点缀，增加视觉层次
- 响应式矢量图形，任意尺寸清晰显示

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
灌糖包子 2026-03-22 03:24:30 +08:00
parent 9232901211
commit ad9c2b0086
Signed by: sookie
GPG Key ID: 0599BECB75C1E68D
3 changed files with 71 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/favicon.ico
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 66 KiB

2
public/index.html
View File

@ -2,7 +2,7 @@
<html>
<head>
<meta charset="UTF-8" />
<link rel="icon" href="./favicon.ico" />
<link rel="icon" type="image/svg+xml" href="./logo.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>博客管理后台</title>
</head>

70
public/logo.svg Normal file
View File

@ -0,0 +1,70 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<defs>
<!-- 主渐变：深紫到亮紫 -->
<linearGradient id="bookGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#7c3aed;stop-opacity:1" />
<stop offset="50%" style="stop-color:#a855f7;stop-opacity:1" />
<stop offset="100%" style="stop-color:#c084fc;stop-opacity:1" />
</linearGradient>
<!-- 阴影渐变 -->
<linearGradient id="shadowGradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-color:#000000;stop-opacity:0.2" />
<stop offset="100%" style="stop-color:#000000;stop-opacity:0" />
</linearGradient>
<!-- 内页渐变 -->
<linearGradient id="pageGradient" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" style="stop-color:#f3e8ff;stop-opacity:1" />
<stop offset="100%" style="stop-color:#e9d5ff;stop-opacity:1" />
</linearGradient>
</defs>
<!-- 背景圆形 -->
<circle cx="256" cy="256" r="240" fill="url(#bookGradient)"/>
<!-- 书本主体阴影 -->
<ellipse cx="256" cy="420" rx="140" ry="20" fill="url(#shadowGradient)"/>
<!-- 书本下半部分（封面） -->
<path d="M126 180 L256 220 L386 180 L386 380 Q256 410 126 380 Z"
fill="#6d28d9"/>
<!-- 书本左页 -->
<path d="M126 180 Q191 160 256 180 L256 380 Q191 360 126 380 Z"
fill="url(#pageGradient)"/>
<!-- 书本右页 -->
<path d="M256 180 Q321 160 386 180 L386 380 Q321 360 256 380 Z"
fill="url(#pageGradient)"/>
<!-- 书脊/中缝 -->
<path d="M246 175 L266 175 L266 385 L246 385 Z"
fill="#a855f7" opacity="0.8"/>
<!-- 书页折痕（左） -->
<path d="M136 200 Q191 185 246 200"
stroke="#c084fc" stroke-width="2" fill="none" opacity="0.6"/>
<path d="M136 240 Q191 225 246 240"
stroke="#c084fc" stroke-width="2" fill="none" opacity="0.4"/>
<path d="M136 280 Q191 265 246 280"
stroke="#c084fc" stroke-width="2" fill="none" opacity="0.3"/>
<!-- 书页折痕（右） -->
<path d="M266 200 Q321 185 376 200"
stroke="#c084fc" stroke-width="2" fill="none" opacity="0.6"/>
<path d="M266 240 Q321 225 376 240"
stroke="#c084fc" stroke-width="2" fill="none" opacity="0.4"/>
<path d="M266 280 Q321 265 376 280"
stroke="#c084fc" stroke-width="2" fill="none" opacity="0.3"/>
<!-- 书本高光 -->
<ellipse cx="200" cy="220" rx="30" ry="15"
fill="#ffffff" opacity="0.3" transform="rotate(-20 200 220)"/>
<ellipse cx="312" cy="220" rx="30" ry="15"
fill="#ffffff" opacity="0.3" transform="rotate(20 312 220)"/>
<!-- 装饰性书签 -->
<path d="M290 140 L290 220 L300 210 L310 220 L310 140 Z"
fill="#fbbf24" opacity="0.9"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.7 KiB