https://github.com/zyplj/sharpicoweb
SharpIcoWeb基于SharpIco轻量级图标生成工具，可将一张高分辨率 PNG 图片一键生成标准的 Windows .ico 图标文件，内含多种尺寸（16x16 到 256x256）。内置图标结构分析功能，轻松验证 .ico 文件中包含的图层与尺寸。采用 .NET Core Minimal API + Vue实现的web程序。
https://github.com/zyplj/sharpicoweb
csharp dotnet ico image tool vite vue
Last synced: about 2 months ago
JSON representation
SharpIcoWeb基于SharpIco轻量级图标生成工具，可将一张高分辨率 PNG 图片一键生成标准的 Windows .ico 图标文件，内含多种尺寸（16x16 到 256x256）。内置图标结构分析功能，轻松验证 .ico 文件中包含的图层与尺寸。采用 .NET Core Minimal API + Vue实现的web程序。
- Host: GitHub
- URL: https://github.com/zyplj/sharpicoweb
- Owner: ZyPLJ
- License: mit
- Created: 2025-06-24T06:49:33.000Z (about 1 year ago)
- Default Branch: master-zy
- Last Pushed: 2025-06-30T07:56:15.000Z (12 months ago)
- Last Synced: 2025-06-30T08:40:02.997Z (12 months ago)
- Topics: csharp, dotnet, ico, image, tool, vite, vue
- Language: C#
- Homepage: https://ico.pljzy.top/
- Size: 22.9 MB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.txt
Awesome Lists containing this project
README
# 基于SharpIco开发图片转ICO工具网站
# SharpIcoWeb
[](https://camo.githubusercontent.com/bb4e5c0036a6a8cdbc59b38d44f09ad8f6dc722751dad34d3df5bf0ac61913c1/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6c6963656e73652d4d49542d626c7565)
## 📝项目介绍
[SharpIcoWeb](https://github.com/ZyPLJ/SharpIcoWeb)是基于[SharpIco](https://github.com/star-plan/sharp-ico)开发的图片转ICO工具网站，支持上传png、jpg等图片转换为多尺寸的Ico图片文件。采用前后端分离技术。
后端接口使用 `.NET Minimal API`开发，够轻量。
## 📍项目地址
`https://github.com/ZyPLJ/SharpIcoWeb`
## 🎯 应用场景
* 网站Favicon 🌐
* 软件图标 🖥️
* 个性化文件夹标识 📂
```html
```
## ✨核心技术
| **⚡** **Vite+Vue+Element-Plus** **极速的开发服务器和高效的生产构建** | **🗂️ → ❌** **纯文件操作（无需SQLite/MySQL）** |
| :-------------------------------------------------------------------------------------: | :-----------------------------------------------------------------: |
| **🏗️.NET 9 MiniAPI 轻量级API开发，处理图像转换业务逻辑** | **🖼️** **后端使用的强大图像处理库，实现PNG/JPG转ICO** |
| **🐳** **可容器化（Docker 支持）** | **📱 + 💻** **响应式设计（适配移动端）** |
## ✅后续更新
* [X] 不同尺寸ICO,可分别生成ICO文件。
* [X] 前端显示ICO文件图标数量数据、大小、偏移等数据。
* [ ] 批量转换功能。
## 🚀快速开始
### Docker部署
注意注释部分配置可能需要根据实际情况修改
#### Docker CLI
```dockerfile
docker-compose up --build -d
```
#### default.conf
```dsconfig
server {
listen 5173; # 配置端口
server_name 0.0.0.0; # 修改为docker服务宿主机的ip
# 设置允许的最大请求体大小（例如 100MB）
client_max_body_size 100M;
location / {
root /usr/share/nginx/html;
index index.html index.htm;
try_files $uri $uri/ /index.html =404;
}
location /api {
proxy_pass http://backend:5235; # Docker 内部网络
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
```
#### Docker Compose
```yaml
version: '3.8'
services:
frontend:
build:
context: ./sharp-ico-vue # 指向前端目录
dockerfile: Dockerfile
ports:
- "5173:5173" # 前端映射到宿主机的5173端口
depends_on:
- backend
backend:
build:
context: . # 指向后端目录
dockerfile: Dockerfile
ports:
- "5235:5235" # 后端端口
```
### 手动部署
#### clone
`git clone https://github.com/ZyPLJ/SharpIcoWeb.git`
#### 后端运行
```
cd SharpIcoWeb
dotnet build -c Release
dotnet run
```
#### 前端运行
```bash
cd ..
cd sharp-ico-vue
npm install
npm run dev
```
## 👀如何使用
前后端项目运行或部署后，打开运行后网址。
选择需要生成的ICO图表尺寸，可多选
上传图片文件，点击转换。
### 1.1.0 版本
该版本更新了分别生成功能，将图片转为不同尺寸的单ico文件。
### 1.2.0 版本
该版本更新了前端显示ICO文件图标数量数据、大小、偏移等数据功能。
### 1.5.0 版本
该版本新增多语言国际化支持，支持中文、英文、日文界面切换，提升用户体验。
## 🛠 开发指南
### 项目结构
```
sharp-ico/
├── SharpIco/ # 图标转换类库
├── IcoEndpoints.cs # 端点类
│ ├── SharpIco.csproj
├── SharpIcoWeb/ # 后端Api项目
│ ├── SharpIcoWeb.csproj
├── sharp-ico-vue # 前端项目
```
### 开发环境
* .Net 9
* Node.js 20.19+
* Vue3
### 运行项目
#### 后端
```bash
dotnet build -c Release
dotnet run
```
#### 前端
```bash
npm install
npm run dev
```
## 常见问题
### 部署后前端容器不启动
`unknown directive "server" in /etc/nginx/conf.d/default.conf:1`
查看前端目录下 `default.conf`文件开头是否存在特殊符号或者空格：
## 相关链接
* [SharpIco](https://github.com/star-plan/sharp-ico "SharpIco是一个纯 C# AOT 实现的轻量级图标生成工具") 🌟 Star if useful!
- [SharpIcoWeb](https://github.com/ZyPLJ/SharpIcoWeb) 🌟 Star if useful!