naser/libra
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

complete story 12.6

Browse Source
This commit is contained in:
Naser Mansour
2026-01-04 02:31:30 +02:00
parent 45f029a1db
commit 149b3c4e53
7 changed files with 131 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/brand.md
+20 -6
View File
@@ -29,11 +29,25 @@ The logo features a stylized botanical illustration within a square frame. Centr
## Color Palette
### Primary Colors
| Color | Hex Code | Usage |
|-------|----------|-------|
| Charcoal | `#4A4A42` | Primary backgrounds, text |
| Warm Gray | `#C9C4BA` | Secondary backgrounds, accents |
| Off-White | `#E8E4DC` | Light backgrounds |
| Dark Forest Green | `#2D3624` | Header/Footer backgrounds |
| Warm Gold | `#A68966` | CTA buttons, links, accents |
| Warm Cream | `#F4F1EA` | Main page background |
| Forest Green | `#2D322A` | Headings, body text |
| Pure White | `#FFFFFF` | Card backgrounds |
| Olive Green | `#4A5D23` | Active states |
### Color Variants
| Color | Hex Code | Usage |
|-------|----------|-------|
| Primary Light | `#3D4634` | Primary hover states |
| Gold Hover | `#8A7555` | Button hover states |
| Gold Light | `#C4A882` | Light accents |
| Olive Hover | `#5A7030` | Olive hover states |
| Deep Black | `#1A1A1A` | Logo artwork, headlines |
---
@@ -79,12 +93,12 @@ Maintain clear space around the logo equal to the height of one water droplet el
Logo should not appear smaller than 40px in height for digital or 15mm for print.
### Backgrounds
- Use on light neutral backgrounds (off-white, warm gray)
- May be reversed to light color on dark charcoal backgrounds
- Use on light neutral backgrounds (Warm Cream #F4F1EA, Pure White #FFFFFF)
- May be reversed to light color on Dark Forest Green (#2D3624) backgrounds
- Avoid busy or patterned backgrounds
### Badge Style (for colored backgrounds)
When the logo appears on olive green or other colored backgrounds (e.g., navigation, footer), apply badge styling to make the logo's beige background look intentional:
When the logo appears on Dark Forest Green (#2D3624) or other colored backgrounds (e.g., navigation, footer), apply badge styling to make the logo's cream background look intentional:
- Border: 2px solid Deep Black (#1A1A1A)
- Shadow: 4px 4px 6px rgba(26, 26, 26, 0.5)
- This creates a "seal/stamp" effect that frames the logo professionally