Skip to content

Latest commit

 

History

History
101 lines (71 loc) · 3.72 KB

DESIGN.md

File metadata and controls

101 lines (71 loc) · 3.72 KB

WallGodds Design Documentation

📝 Have Suggestions?

We value your input! If you have ideas or feedback about the design, feel free to share them in the Discussions.

🎨 Designer? Contribute to Our Design

If you're a designer interested in contributing directly to our Figma design file, we’d love to have your expertise! Please fill out this form to request access. Once approved, you’ll be granted edit permissions to collaborate effectively.

📂 Design Resources

Our design work is centralized in a Figma file, which is constantly updated as the project progresses. This file includes wireframes, prototypes, and finalized design assets.

👉 WallGodds Figma Design

🛠️ Design Components

Color Palette

The primary color palette for the website:

Color Hex Code Usage
Primary (White) #FFFFFF Background
Secondary (Black) #000000 Text
SidebarGradient (1st Color) #FDD7DE Background
SidebarGradient (2nd Color) #E6E1FD Secondary backgrounds
Main Primary BG (GRADIENT 1st color) #7056F5 Background
Main Primary 1BG (GRADIENT 2nd color) #ABB3FE Background
Main Primary 2BG (GRADIENT 1st color) #F2AB93 Background
Main Primary 2BG (GRADIENT 2nd color) #F76582 Background
Nav Bar GRADIENT (1st color) #008FFF Nav Bar border
Nav Bar GRADIENT (2nd color) #FF9D00 Nav Bar border
Nav Bar GRADIENT (3rd color) #D90000 Nav Bar border
Nav Bar GRADIENT (4th color) #970088 Nav Bar border
Button (Solid) #FF0000 Like Button
Button (Solid) #808080 Download Button

Typography

  • Logo Gruppo Font Size - 41.14
  • Comfortaa Regular (Nav bar ---Font size 23.46)
  • Comfortaa Regular (Side bar ---Font size 23.46)
  • Comfortaa Regular (user name and download button) ---size 19.3

📐 Layouts and Breakpoints

  • Width - 1920
  • Height - ∞

Grid System

WallGodds uses a ∞ column grid system for layouts to ensure responsiveness.

Breakpoints

The website is designed to support the following screen sizes:

  • Mobile: Coming Soon
  • Tablet: Coming Soon
  • Desktop: ≥ 1920px

📑 Pages and Key Elements

Page-wise Design Documentation

Gallery Page

  • Nav Bar: Home, Galary, Upload, About Us, Search Bar, Profile Icon
  • Side Bar: Highlight device types (Mobile, Tablet, Desktop).
  • Scrollable Section: Encourage users to explore wallpapers.

MORE PAGES COMING SOON

💡 Suggestions

If you think any design components can be improved or have suggestions, please:

  1. Open a GitHub discussion or issue.
  2. Provide references or examples for clarity.