Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/0xabdulkhaliq/clipboard-landing-page

This is a solution to the "Clipboard Landing Page" challenge on Frontend Mentor
https://github.com/0xabdulkhaliq/clipboard-landing-page

bem css3 frontend frontend-mentor frontendmentor-challenge google-fonts html5

Last synced: 11 days ago
JSON representation

This is a solution to the "Clipboard Landing Page" challenge on Frontend Mentor

Awesome Lists containing this project

README

        

frontendmentor

Clipboard Landing Page Solution



Frontend Mentor Challenge




View Demo
 · 
Report Bug
 · 
Request Feature





Abdul Khalid's Profile
   



Status Completed
   



Challenge Difficulty - Junior





## **Preview**


Clipboard Landing Page solution preview image


## **Links**

- |||
| :----- | :----- |
| Solution URL: | [CLIPBOARD LANDING PAGE 🎯 [ ACCESSIBLE - ES6 - BEM - VANILLA CSS3 ]](https://www.frontendmentor.io/solutions/clipboard-landing-page-accessible-es6-bem-vanilla-css3-Y3Y3OQ8o--) |
| Live Site URL: | [https://0xabdulkhalid.github.io/clipboard-landing-page/](https://0xabdulkhalid.github.io/clipboard-landing-page/) |
|||


## Pagespeed Insights Score:

- ||
| :-----: |
| Overall score 98% for Both Mobile & Desktop |
| |
| Scoreboard |
| |
| Check out [**Pagespeed Insights**](https://pagespeed.web.dev/analysis/https-0xabdulkhalid-github-io-clipboard-landing-page/mmcr0olqn7?form_factor=mobile) to get live score |
||


## The Challenge

- The challenge is to build out this Clipboard Landing Page and get it looking as close to the design as possible.
- Users should be able to:
- View the optimal layout for the site depending on their device's screen size
- See hover states for all interactive elements on the page


## **Built With**

![HTML5](https://img.shields.io/badge/html5-%23E34F26.svg?style=for-the-badge&logo=html5&logoColor=white)   ![CSS3](https://img.shields.io/badge/css3-%231572B6.svg?style=for-the-badge&logo=css3&logoColor=white)  


## **Tools Used**

![Google](https://img.shields.io/badge/google-DA4437?style=for-the-badge&logo=google&logoColor=white)   ![Prettier](https://img.shields.io/badge/prettier-1A2C34?style=for-the-badge&logo=prettier&logoColor=F7BA3E)   ![Visual Studio Code](https://img.shields.io/badge/VS%20Code-0078d7.svg?style=for-the-badge&logo=visual-studio-code&logoColor=white)   ![Git](https://img.shields.io/badge/Git-F05032?style=for-the-badge&logo=git&logoColor=white)


## **Acknowledgment**

- Challenge was provided by [Frontend Mentor](https://www.frontendmentor.io)


## **Let's Connect 👋**


Linkedin Profile
   


Frontend-Mentor Profile
   


Github Profile