Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/hritik5102/css-daily-challenge
Daily CSS Projects
https://github.com/hritik5102/css-daily-challenge
css css-challenge html project sass
Last synced: 19 days ago
JSON representation
Daily CSS Projects
- Host: GitHub
- URL: https://github.com/hritik5102/css-daily-challenge
- Owner: hritik5102
- Created: 2024-08-01T19:25:38.000Z (5 months ago)
- Default Branch: main
- Last Pushed: 2024-10-24T18:17:28.000Z (2 months ago)
- Last Synced: 2024-10-25T07:32:36.042Z (2 months ago)
- Topics: css, css-challenge, html, project, sass
- Language: HTML
- Homepage:
- Size: 145 KB
- Stars: 1
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## CSS Daily Challenge ✨
### Welcome to the CSS Daily Challenge repository!
This repository is a collection of CSS projects created as part of a daily challenge to improve CSS skills. Feel free to explore, learn, and contribute!
### Projects
| No. | Project | Live Demo |
| :-: | --------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------- |
| 01 | [Multicolor border using conic gradient](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/01-multicolor-border-using-conic-gradient) | [Live Demo](https://codepen.io/HritikDj/pen/XWLNjPB) |
| 02 | [Modern CSS Resets](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/02-modern-css-resets) | [Live Demo](https://codepen.io/HritikDj/pen/XWLNjPB) |
| 03 | [Styling table](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/03-styling-table) | [Live Demo](https://codepen.io/HritikDj/pen/OJYRxGp) |
| 04 | [Circle SVG Animation Using π Constant](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/02-modern-css-resets) | [Live Demo](https://codepen.io/HritikDj/pen/yLWExyK) |
| 05 | [CSS Inheritance](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/05-css-inheritance) | [Live Demo](https://codepen.io/HritikDj/pen/jOgZQoa) |
| 06 | [HSL Color Scheme](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/06-hsl-color-scheme) | [Live Demo](https://codepen.io/HritikDj/pen/OJeJzYy) |
| 07 | [A11y - Two tonned outline](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/07-two-tonned-outline-a11y) | [Live Demo](https://codepen.io/HritikDj/pen/KKJRpbV) |
| 08 | [Color All Diagonal Cells](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/08-color-all-diagonal-cells) | [Live Demo](https://codepen.io/HritikDj/pen/ZErmMxd) |
| 09 | [Call to action card](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/09-call-to-action-card) | [Live Demo](https://codepen.io/HritikDj/pen/yLQyXQR) |
| 10 | [URL Input Validation Using CSS](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/10-url-input-type-validation-using-css) | [Live Demo](https://codepen.io/HritikDj/pen/zYWWWWM) |
| 11 | [Negative Margin Effect](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/11-negative-margin-effect) | [Live Demo](https://codepen.io/HritikDj/pen/JjQZjRj) |
| 12 | [Button Sliding Effect](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/12-button-sliding-effect) | [Live Demo](https://codepen.io/HritikDj/pen/dydgbVQ) |
| 13 | [CSS Position Property](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/13-css-position-property) | [Live Demo](https://codepen.io/HritikDj/pen/yLvqRPP) |
| 14 | [Border Playground](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/14-border-playground) | [Live Demo](https://codepen.io/HritikDj/pen/xxvjgMJ) |
| 15 | [Focus Within Pseudo Class](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/15-focus-within-pseudo-class) | [Live Demo](https://codepen.io/HritikDj/pen/mdMaPmV) |
| 16 | [Word in the center of horizontal line](https://github.com/hritik5102/CSS-Daily-Challenge/tree/main/16-word-in-the-center-of-horizontal-line) | [Live Demo](https://codepen.io/HritikDj/pen/PoKVpzx) |
### Project Structure
1. Each CSS project should be in its own folder.
2. The folder name should be descriptive of the project.
3. Include an `index.html` file to showcase the CSS.
### Contributing
Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are **greatly appreciated**.
Make sure your changes don't break existing functionality without `good reason`.
1. Fork the Project
2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
4. Push to the Branch (`git push origin feature/AmazingFeature`)
5. Open a Pull Request
Discuss the features, ideas you want to add to the project from [here 📌](https://github.com/hritik5102/CSS-Daily-Challenge/discussions)
### Roadmap
See the [open issues](https://github.com/hritik5102/CSS-Daily-Challenge/issues) for a list of proposed features (and known issues).
### License
Distributed under the [MIT License](LICENSE). See LICENSE for more information.
### Guidelines
1. Feel free to experiment with different CSS techniques and properties.
2. Try to create visually appealing and functional designs.
3. Provide clear explanations for your code (if applicable).
4. Respect the work of others and contribute positively to the community.
Let's build a strong CSS community together!
If you have any questions or suggestions, feel free to open an issue.
Happy coding! 😄
### Contributor
| 
|
| :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: |
| **[Hritik Jaiswal](https://hritik5102.github.io/)** |
| 
|