This project is a simple, responsive landing page template designed using HTML and CSS. It features a navigation bar, a home section, and a features section. The design is minimalistic and user-friendly, with an emphasis on clarity and ease of use.
-
Clone the Repository:
git clone https://github.com/yourusername/uifry-template.git
-
Navigate to the Project Directory:
cd uifry-template
-
Open the Project in a Code Editor: Open the project in your preferred code editor (e.g., VSCode).
-
Open index.html in a Browser: Simply open the index.html file in your web browser to view the template.
Design Choices: 1. Minimalistic Design: The template uses a clean and simple design to ensure that the content is the main focus.
-
Responsive Layout: The layout is designed to be responsive, making it accessible on various devices, including mobile phones and tablets.
-
Custom Fonts: The template uses custom fonts ("Clash Display" and "Clash Display Bold") for a unique and modern look.
-
Hover Effects: Subtle hover effects are used on navigation links and buttons to enhance the user experience.
-
Hierarchical Communication Patterns: Proposed to further ease the burden on the central server, by first leveraging edge servers to aggregate the updates from edge devices and then relying on a cloud server to aggregate updates from edge servers.
-
Libraries Used: No external libraries were used in this project. The design relies solely on HTML and CSS.
-
Figma Design Reference: The design for this project was inspired by a Figma design. You can view the Figma design here.
The project is deployed on Vercel. You can view the live demo here.
uifry-template/
│
├── assets/
│ ├── fonts/
│ │ ├── clash-display/
│ │ │ ├── ClashDisplayRegular.otf
│ │ │ └── ClashDisplayBold.otf
│ ├── images/
│ │ ├── logo_favi.svg
│ │ ├── logo.svg
│ │ ├── arrow.svg
│ │ ├── player_btn.svg
│ │ ├── achievements.svg
│ │ ├── background.svg
│ │ ├── background_rotate.svg
│ │ ├── mobile_screen_home.svg
│ │ ├── feature_mob.svg
│ │ ├── bullet1.svg
│ │ ├── bullet2.svg
│ │ └── bullet3.svg
│
├── index.html
├── styles.css
└── README.md
Feel free to fork this project and make your own modifications. Pull requests are welcome!