Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/mariumshiraz/100_days_challenges_day-1

Day 1: CSS Challenge
https://github.com/mariumshiraz/100_days_challenges_day-1

100-days-css-challenge css3 html-css html5

Last synced: 1 day ago
JSON representation

Day 1: CSS Challenge

Awesome Lists containing this project

README

        

# 📅 Day 1: CSS Challenge

## 🌟 Project Overview
Welcome to the CSS Challenge for Day 1! This project showcases a creative design for displaying "100" using pure HTML and CSS. The design includes a gradient background and stylized shapes to represent the numbers.

## 📂 Files
- **index.html**: The main HTML file for the structure of the page.
- **style.css**: The CSS file that styles the page with gradients, shapes, and layout.

## 🛠️ Features
- **Gradient Background** 🌈: Creates a visually appealing effect from orange to light orange.
- **Stylized Numbers** 🔢: Unique design for the numbers "1" and "0" using CSS shapes and transformations.
- **Responsive Layout** 📱: Centered content that adjusts well to different screen sizes.

## 🚀 How to Run
1. **Clone the Repository** 🧩:
```bash
git clone
```
2. **Open `index.html`** in your web browser to view the design.

## 📜 Key Technologies
- **HTML5** 🛠️
- **CSS3** 🎨
- CSS Variables
- Flexbox
- Box Shadows
- Transforms

## 📸 Screenshot
![day_1](https://github.com/Fredy002/100-Days-Of-CSS-Projects/assets/104151778/ebd3508f-7c7d-4be2-9ed2-3f879c095c3c)

## 💡 Inspiration
Inspired by modern CSS techniques to create clean and effective designs.

## 🎉 Enjoy experimenting with CSS and pushing your design skills!