Here is my solution to the project: https://www.codecademy.com/workspaces/64e82f186b4702dd5fa8cabe
Wireframes and styles for my website
This repository contains the web design or design system for my website. It includes the styles, components, and guidelines for consistent and cohesive design throughout the site.
The chosen fonts for this design are:
- Font Name: [Quicksand]
- Font Name: [Poppins]
- Font Name: [Nunito Sans]
To use these fonts, you can import them from Google Fonts or include the necessary font files in your project.
The design system follows the following typography guidelines:
Font-weight: 700 (bold)
Font-family: Nunito Sans
Font-weight: 400 (regular)
You can apply these styles to headings and paragraphs throughout your website to maintain consistency.
The color scheme used in this design includes the following colors:
- Primary Color: Bright Lavender #AC8BF1
- Secondary Color: Soap #CDB7F9
- Background Color: White #FFFFF
- Text Color:Chinese Black #16111E
These colors can be referenced and used throughout the website to ensure a cohesive visual experience.
The design system provides a set of buttons with predefined styles. These buttons can be used consistently across the site. The available button styles include:
- Primary Button
- Secondary Button
To use these buttons, apply the corresponding CSS classes or styles to your HTML elements.
The navigation bar is designed to be fixed at the top of the page. It provides easy navigation for users to explore different sections of the website. The navigation bar includes the following features:
- Logo: [My codeacademy logo]
- Links: [https://codecademy-prod.s3.amazonaws.com/profile_thumbnail/644c8b7d32376800188aae59_55396382.jpg]
- Search Bar
- Title of the website
- Nav links
You can customize the navigation bar to fit your website’s specific needs while maintaining its overall structure and functionality.
The footer is designed to appear at the bottom of the page and provides additional information and links. The footer includes the following elements:
- Anchor links for sections of the landing
- Links: [devjanny (Hannah) · GitHub]