open ai service
This commit is contained in:
113
books_flutter/assets/icon/ICON_SPECS.md
Normal file
113
books_flutter/assets/icon/ICON_SPECS.md
Normal file
@@ -0,0 +1,113 @@
|
||||
# Open Book Icon - Exact Specifications
|
||||
|
||||
## Design Layout (1024x1024px)
|
||||
|
||||
```
|
||||
┌─────────────────────────────────┐
|
||||
│ │
|
||||
│ (padding: 150px) │
|
||||
│ │
|
||||
│ ┌───────────────────┐ │
|
||||
│ │ │ │
|
||||
│ │ 📖 Open Book │ │
|
||||
│ │ White (#FFF) │ │
|
||||
│ │ ~700px width │ │
|
||||
│ │ │ │
|
||||
│ └───────────────────┘ │
|
||||
│ │
|
||||
│ Background: #0891B2 │
|
||||
│ │
|
||||
└─────────────────────────────────┘
|
||||
```
|
||||
|
||||
## Two Files Needed
|
||||
|
||||
### 1. app_icon.png (Complete Icon)
|
||||
- Size: 1024x1024px
|
||||
- Background: Solid cyan `#0891B2`
|
||||
- Icon: White open book, centered
|
||||
- Icon size: ~700px wide, maintains aspect ratio
|
||||
- Padding: ~150px from edges
|
||||
|
||||
### 2. app_icon_foreground.png (Adaptive Icon Foreground)
|
||||
- Size: 1024x1024px
|
||||
- Background: **Transparent**
|
||||
- Icon: Same white book as above
|
||||
- Keep in "safe zone": center 66% of canvas (~676x676px)
|
||||
- Android will add the cyan background automatically
|
||||
|
||||
---
|
||||
|
||||
## Color Codes (Copy-Paste Ready)
|
||||
|
||||
- Cyan Background: `#0891B2` or `rgb(8, 145, 178)`
|
||||
- Icon Color: `#FFFFFF` or `rgb(255, 255, 255)`
|
||||
|
||||
---
|
||||
|
||||
## Recommended Free Book Icons (Download & Use)
|
||||
|
||||
### Option A: Heroicons Book-Open (Clean, Modern)
|
||||
- URL: https://heroicons.com
|
||||
- Search: "book-open"
|
||||
- Style: Outline (recommended) or Solid
|
||||
- License: MIT (free to use)
|
||||
|
||||
### Option B: Lucide Book-Open (Minimal)
|
||||
- URL: https://lucide.dev/icons/book-open
|
||||
- Very clean, minimal design
|
||||
- License: ISC (free to use)
|
||||
|
||||
### Option C: Bootstrap Icons Book (Simple)
|
||||
- URL: https://icons.getbootstrap.com/icons/book/
|
||||
- Several book variants available
|
||||
- License: MIT
|
||||
|
||||
---
|
||||
|
||||
## Quick Canva Instructions
|
||||
|
||||
1. **Create design:**
|
||||
- Go to Canva → "Custom size" → 1024 x 1024
|
||||
|
||||
2. **Version 1 (app_icon.png):**
|
||||
- Background: Click background → Color → `#0891B2`
|
||||
- Elements → Upload downloaded SVG book icon
|
||||
- Change icon color to white
|
||||
- Resize to 600-700px, center it
|
||||
- Download → PNG → save as `app_icon.png`
|
||||
|
||||
3. **Version 2 (app_icon_foreground.png):**
|
||||
- Duplicate the design
|
||||
- Remove background (make transparent)
|
||||
- Keep only the white book
|
||||
- Download → PNG → **check "Transparent background"**
|
||||
- Save as `app_icon_foreground.png`
|
||||
|
||||
---
|
||||
|
||||
## What the Final Icon Will Look Like
|
||||
|
||||
**On Home Screen:**
|
||||
- iOS: Rounded square with cyan background + white book
|
||||
- Android (modern): Adaptive shape (circle/squircle/square) with cyan background + white book
|
||||
- Android (old): Rounded square like iOS
|
||||
|
||||
**Visual Balance:**
|
||||
- Book icon should be easily recognizable even at 40x40px
|
||||
- Good contrast ensures readability
|
||||
- White on cyan matches your app's Material 3 theme
|
||||
|
||||
---
|
||||
|
||||
## Alternative: Use Icon Generator
|
||||
|
||||
If you prefer automated approach:
|
||||
|
||||
1. Go to [icon.kitchen](https://icon.kitchen)
|
||||
2. Upload any book icon image
|
||||
3. Set background color: `#0891B2`
|
||||
4. Adjust size/position
|
||||
5. Download all sizes
|
||||
|
||||
(But manual creation gives you more control!)
|
||||
Reference in New Issue
Block a user