Projects in Awesome Lists by Yashi-Singh-9
A curated list of projects in awesome lists by Yashi-Singh-9 .
https://github.com/yashi-singh-9/tooltip-ui
Tooltip UI is a simple project that adds interactive tooltips to navigation links using only HTML and CSS. Hover over a navigation item to see a tooltip with additional information, demonstrating effective use of CSS positioning and transitions.
css hover-effects html positioning
Last synced: 03 Apr 2025
https://github.com/yashi-singh-9/expenses-chart-component
A dynamic Expenses Chart Component built with semantic HTML5, LESS, and Vanilla JavaScript. It features responsive design, interactive bar charts with hover effects, and JSON data integration for dynamic rendering. The project follows a mobile-first approach and enhances styling with the LESS preprocessor. 🚀
css frontend frontend-mentor html javascript json less less-preprocessor
Last synced: 05 Mar 2025
https://github.com/yashi-singh-9/blog-preview-card
Blog Preview Card is a responsive HTML and CSS component designed to showcase a blog post preview. It features a modern design with hover effects, suitable for displaying blog categories, publish dates, titles, descriptions, and author information. Ideal for integrating into various web projects.
css frontend frontend-mentor frontend-mentor-challenge frontend-mentor-solutions html html-css scss scss-framework
Last synced: 25 Feb 2025
https://github.com/yashi-singh-9/news-homepage
This project is a solution to the Frontend Mentor News Homepage Challenge. It showcases a responsive news homepage built using HTML, LESS, JavaScript, and Bootstrap. The page adapts seamlessly to various screen sizes and includes hover and focus effects for interactive elements.
Last synced: 25 Feb 2025
https://github.com/yashi-singh-9/qr-code-component
This project is a responsive QR Code Component built as part of a Frontend Mentor challenge. It displays a QR code that links to the Frontend Mentor website, offering a clean and simple UI to practice and improve front-end development skills.
bootstrap css frontend frontend-mentor frontend-mentor-challenge frontend-mentor-solutions html html-css scss
Last synced: 25 Feb 2025
https://github.com/yashi-singh-9/mortgage-repayment-calculator
A mortgage repayment calculator that allows users to input loan details (amount, term, interest rate, and mortgage type) to calculate monthly repayments and total repayment amounts. It includes form validation with error messages and a responsive design for various screen sizes.
Last synced: 25 Feb 2025
https://github.com/yashi-singh-9/nft-preview-card-component
A responsive NFT Preview Card Component built with HTML, CSS, following best practices for clean, semantic code and accessibility. The project includes a detailed style guide for consistent design and contribution guidelines for easy collaboration.
css frontend frontend-mentor frontend-mentor-challenge html nft nft-card nft-card-component preview-card preview-card-component
Last synced: 25 Feb 2025
https://github.com/yashi-singh-9/newsletter-sign-up-form-with-success-message
This challenge is a responsive newsletter sign-up form with form validation and a success message. Built with HTML, SASS, and JavaScript, it ensures user-friendly interaction and displays real-time feedback for invalid inputs.
css frontend frontend-mentor frontendmentor-challenge html javascript sass
Last synced: 25 Feb 2025
https://github.com/yashi-singh-9/age-calculator-app
A simple web application that calculates a user's age in years, months, and days based on a provided date. The app features form validation, responsive design, and dynamic error handling for invalid or incomplete inputs. Built with HTML, CSS, JavaScript, and LESS.
css frontend frontend-mentor-challenge frontendmentor html javascript less
Last synced: 07 Apr 2025
https://github.com/yashi-singh-9/ui-design-daily
This project converts UI designs from UI Design Daily into functional code, focusing on aesthetics, responsiveness, and accessibility. It serves as a collection of UI components and layouts, regularly updated with new designs.
css frontend html javascript sass sass-framework scss scss-framework ui ui-design ui-design-daily
Last synced: 30 Mar 2025
https://github.com/yashi-singh-9/article-preview-component
This project is a solution to the Article Preview Component challenge from Frontend Mentor. It features a responsive article card with an image, title, description, author info, and a share button that reveals social media links. Built with HTML, CSS (Sass), and JavaScript, the component is mobile-first and fully accessible.
css frontend frontend-mentor frontend-mentor-challenge html javascript scss
Last synced: 18 Feb 2025
https://github.com/yashi-singh-9/single-price-of-grid-component
This project is a solution to the Frontend Mentor Single Price Grid Component challenge. It features a responsive pricing grid with subscription details, benefits, and a call-to-action button. Using Flexbox and CSS Grid, the design ensures a clean, adaptable layout for a smooth user experience across devices.
css frontend frontend-mentor frontendmentor-challenge html scss scss-framework
Last synced: 18 Mar 2025
https://github.com/yashi-singh-9/random-quote-generator
The Random Quote Generator fetches random quotes from the ZenQuotes API and lets users share them on Twitter. Built with HTML5, Bootstrap 5, JavaScript, and Less, it features a responsive design and smooth functionality. 🚀
bootstrap css frontend frontendpro frontendpro-challenge html javascript less less-preprocessor
Last synced: 06 Mar 2025
https://github.com/yashi-singh-9/pricing-card-page
A responsive and interactive pricing card page with monthly and yearly billing toggles and a dropdown for selecting Monthly Active Users (MAUs) in the Pro plan. Built with HTML5, LESS, Flexbox, Media Queries, and JavaScript for dynamic interactivity. The project ensures a clean and user-friendly UI across different devices.
css frontend frontendpro html javascript less less-preprocessor
Last synced: 07 Mar 2025
https://github.com/yashi-singh-9/multi-select-search-component
A reusable, responsive multi-select UI component with search functionality. Users can select multiple options, displayed as removable tags in the search bar, with a clear-all option. Features include a loading spinner during data fetching, search input debouncing for performance, and adaptability to various screen sizes.
css frontend frotendpro html javascript less less-preprocessor
Last synced: 08 Mar 2025
https://github.com/yashi-singh-9/calendar-viewer-component
Build a responsive Calendar Viewer Component that displays the current month, year, and days of the week. Users can navigate between months, with the current day highlighted. Include hover states for all elements and ensure the design closely matches the provided layout.
css frontend frontendpro html javascript less less-preprocessor
Last synced: 09 Mar 2025
https://github.com/yashi-singh-9/intro-component-with-sign-up-form
A responsive sign-up form with real-time validation, built using HTML, Sass, and JavaScript. It features a modern design, clear error messages, and adapts seamlessly to all devices.
css frontend frontend-mentor html javascript sass
Last synced: 01 Apr 2025
https://github.com/yashi-singh-9/share-content-card-component
A responsive Share Content Card Component built with HTML, Sass, and JavaScript. It allows users to share content on social media platforms (e.g., Facebook, Twitter, Instagram) and copy a shareable link to the clipboard. Features include hover effects, responsive design, and clipboard functionality.
css frontend frontendpro frontendpro-challenge html javascript sass
Last synced: 01 Apr 2025
https://github.com/yashi-singh-9/ping-coming-soon-page
This is a solution to the "Ping Coming Soon Page" challenge on Frontend Mentor. It includes a subscription form with email validation, responsive design using Flexbox, and error handling for invalid or empty email inputs. Built with HTML, SASS, and JavaScript for interactivity and mobile-first responsiveness.
css frontend frontendmentor frontendmentor-challenge html javascript sass
Last synced: 01 Apr 2025
https://github.com/yashi-singh-9/multi-step-form
A multi-step form that collects user information, skill levels, and challenge preferences with a progress bar and confirmation screen. Styled with SCSS and powered by JavaScript for form navigation and validation.
css frontend frontendpro frontendpro-challenge html javascript scss
Last synced: 01 Apr 2025
https://github.com/yashi-singh-9/toast-notification-component
A responsive and reusable **Toast Notification Component** built with HTML, SCSS, and JavaScript. It supports multiple notification types (`success`, `info`, `warning`, `error`), smooth animations, auto-dismissal, and manual closing. Designed for easy integration into any web project.
css dom-manipulation frontend frontend-pro html javascript scss
Last synced: 01 Apr 2025
https://github.com/yashi-singh-9/sql-projects
Projects of SQL
mariadb mariadb-database ms-sql mssql-database postgresql sql sqlite
Last synced: 10 Mar 2025
https://github.com/yashi-singh-9/expense-tracker
A simple Expense Tracker built in C++ to help users manage their finances. It allows users to add, update, delete, and view expenses, as well as track spending by category and month. The application also supports setting a monthly budget, displaying a warning if the budget is exceeded, and exporting expenses to a CSV file for easy record-keeping.
cli filesystem logic-building programming-language
Last synced: 25 Mar 2025
https://github.com/yashi-singh-9/countdown-timer
A simple countdown timer that dynamically displays the time remaining until the New Year in months, days, hours, minutes, and seconds. Built with HTML, CSS, and JavaScript, it features a responsive design, hover animations, and a serene mountain background. When the countdown ends, it shows a festive "Happy New Year!" message.
countdowntimer css css-animation css-map dynamic-timer frontend-developement html javascript new-year-countdown resposive-design sass
Last synced: 25 Mar 2025
https://github.com/yashi-singh-9/cafe-menu
Welcome to Camper Cafe! Enjoy our selection of freshly brewed coffees, including favorites like French Vanilla, Caramel Macchiato, and Hazelnut. Treat yourself to delicious desserts such as Donuts, Cherry Pie, and Cheesecake. Our cozy atmosphere and friendly service make every visit special.
Last synced: 25 Mar 2025
https://github.com/yashi-singh-9/blog-card-component
In this Front-end Challenge, I have build a Blog Card Component. This challenge is perfect for you if you've been learning CSS and want to take your CSS skills to the next level by building something new and beginner-friendly.
css frontend frontendpro-challenge html
Last synced: 25 Mar 2025
https://github.com/yashi-singh-9/task-tracker---roadmap-project
Task Tracker CLI is a simple command-line app to manage tasks. Users can add, update, delete, and view tasks with statuses like "To Do," "In Progress," and "Done." It helps organize and track tasks efficiently.
cli cpp filesystem programming-language
Last synced: 25 Mar 2025
https://github.com/yashi-singh-9/freecodecamp
Various Solution of freeCodeCamp learning
Last synced: 25 Mar 2025
https://github.com/yashi-singh-9/a-photo-gallery
This project, "A Photo Gallery," is a responsive photo gallery created with HTML and CSS Flexbox. It features a collection of images in an organized layout, designed to be customizable and user-friendly. Ideal for web developers, this gallery offers a stylish and efficient way to display images on any website.
Last synced: 25 Mar 2025
https://github.com/yashi-singh-9/leetcode-daily-problems-solutions
In this I will be sharing my solution of leetcode problems
Last synced: 25 Mar 2025
https://github.com/yashi-singh-9/tip-calculator-app
The Tip Calculator App is a responsive web application that allows users to calculate the tip amount and total cost per person based on the bill amount and selected tip percentage. Built with HTML, LESS, JavaScript, and Bootstrap 5, the app features a dynamic UI, custom tip input, and real-time calculations for an intuitive user experience.
bootstrap css frontend-mentor frontend-mentor-challenge html javascript less less-preprocessor
Last synced: 25 Mar 2025
https://github.com/yashi-singh-9/pricing-component-with-toggle
The Pricing Component with Toggle is a responsive pricing table that lets users switch between monthly and annual plans. Built with HTML, CSS (LESS), and JavaScript, it updates prices dynamically and ensures accessibility with keyboard support.
bootstrap css frontend frontend-mentor html javascript less less-preprocessor
Last synced: 25 Mar 2025
https://github.com/yashi-singh-9/notifications-page
"Notification Page" is a Frontend Mentor challenge to create a responsive notification UI with dynamic interactions. Built using HTML, LESS, and JavaScript.
css frontend frontend-mentor html javascript less less-preprocessor
Last synced: 20 Feb 2025
https://github.com/yashi-singh-9/codepen-challenge
This repository contains solution of code pen challenge.
codepen-challenge cpc-css-filter cpc-drop-cap cpc-hot-cold cpc-layered-text cpc-light-dark cpc-rock-pen-scissors cpc-snowflakes cpc-svg-filters cpc-text-art cpc-timers cpc-todo-list cpc-wall-of-text
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/payment-landing-page
A responsive and modern landing page for a credit card service, designed using HTML, LESS, and JavaScript. Features include a responsive navbar, interactive buttons, and a clean, mobile-friendly layout. Built as part of a Frontend Pro coding challenge.
css frontend frontend-pro frontendpro frontendpro-challenge html javascript less
Last synced: 26 Mar 2025
https://github.com/yashi-singh-9/contact-form
This project is a contact form solution for the Frontend Mentor challenge. It includes custom validation, success notifications, and is optimized for accessibility and responsive design. Built with HTML, CSS, and JavaScript.
css frontend frontend-mentor html javascript
Last synced: 20 Mar 2025
https://github.com/yashi-singh-9/star-rating-component
This project is a simple, responsive star rating component that allows users to select a rating between 1 and 5 stars, with dynamic feedback messages displayed based on the selected rating.
Last synced: 20 Mar 2025
https://github.com/yashi-singh-9/feedback-modal-component
In this frontend challenge, you'll build a Feedback Modal Component. This challenge is perfect for you if you've been learning HTML and CSS and are looking to practice what you've learned by building something new and beginner-friendly.
css frontend frontend-pro html javascript
Last synced: 20 Mar 2025
https://github.com/yashi-singh-9/number-guessing-game
A CLI game where the player guesses a randomly selected number between 1 and 100. The player chooses a difficulty (Easy, Medium, Hard) that determines the number of attempts. The goal is to guess the number within the given attempts.
cli logic-building programming-language
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/yashi-singh-9
Config files for my GitHub profile.
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/restricted-textarea
Restricted Textarea is a simple web component that limits the number of characters in a textarea with real-time feedback. It visually alerts users when the character limit is reached. Perfect for use in forms requiring constrained input lengths.
css dom-manipulation html html-css html-css-javascript javascript roadmap-project
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/reddit-client
A Reddit client to view multiple subreddits in separate lanes. Users can add, refresh, and remove lanes, with data saved in local storage.
api-integration asynchronous-programming css dom-manipulation html javascript
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/order-summary-component
The Order Summary Card is a responsive web component displaying subscription details with modern HTML and CSS. It features clean design, interactive elements, and mobile-first responsiveness for a smooth user experience on any device.
bootstrap css frontend frontend-mentor frontend-mentor-challenge frontendmentor-challenge html scss
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/leetcode-daily-solutions
I am currently solving Leetcode problems on a daily basis, focusing on JavaScript solutions to enhance my problem-solving skills and proficiency in the language.
javascript leetcod-daily-solution leetcode vanilla-javascript
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/temperature-converter
The Temperature Converter is a web app for converting temperatures between Celsius, Fahrenheit, and Kelvin. It practices DOM manipulation, form handling, and basic JavaScript calculations. The “Convert” button activates once all fields are filled, providing instant results.
css dom dom-manipulation html javascript manipulation roadmap roadmap-project
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/age-calculator
This Age Calculator is a web app that lets users input their birthdate and calculates their exact age in years, months, and days using Luxon for date manipulation and Flatpickr for a custom datepicker.
css dom-manipulation html javascript package-management
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/product-preview-card-component
The Product Preview Card Component is a front-end project designed to showcase a sleek, responsive product card. This component is part of a challenge from Frontend Mentor, aimed at enhancing web development skills by building realistic, interactive UI components.
css css3 flexbox frontend frontend-mentor frontend-mentor-challenge html html5
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/faq-accordion
The FAQ Accordion is a responsive web component that lets users toggle answers to frequently asked questions. It features interactive expand/collapse functionality, supports keyboard navigation, and adapts to various screen sizes. Designed with a modern look, it enhances both usability and accessibility.
css frontend frontend-mentor frontend-mentor-challenge html javascript
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/changelog-component
The Changelog Component is a sleek and responsive timeline display for showcasing updates and changes in a project. It provides a clean, chronological view of recent modifications with a modern design, making it easy to keep users informed about the latest developments.
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/image-grid-layout
The Image Grid Layout project is a responsive image grid built using **CSS Grid**, inspired by a task from [roadmap.sh](https://roadmap.sh/projects/image-grid). It showcases six images arranged in a flexible grid that adapts to different screen sizes, helping developers practice grid-based layouts and responsive design techniques.
css frontend grid grid-layout grid-layouts html layout responsive responsive-design roadmap roadmap-project
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/basic-html-website
The Basic HTML Website project showcases a simple portfolio template using only HTML, helping beginners learn the core structure of a web page with sections like header, footer, and navigation.
frontend html roadmap roadmap-project
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/stats-preview-card-component
This project is a solution to the Stats Preview Card Component challenge from Frontend Mentor. It involves building a responsive card component using Flexbox and CSS Grid that adapts to different screen sizes. The card includes a background image, a headline with descriptive text, and a statistics section displaying numerical data with labels.
css frontend frontend-mentor frontendmentor-challenge html
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/datepicker-ui
Datepicker UI is a simple, static datepicker component built with HTML and CSS. It provides a basic calendar interface for date selection without functionality, serving as a foundation for adding JavaScript interactivity later. Perfect for UI design practice or as a starter project.
css html layout layouts positioning roadmap roadmap-project
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/single-page-cv
Single Page CV is a responsive HTML/CSS template for creating a professional one-page resume. Ideal for frontend developers and designers, it offers a clean layout to showcase skills, education, experience, and online presence. The simple, customizable design adapts to any screen size, ensuring your information is presented effectively.
css frontend html layout roadmap-project semantic semantic-html seo
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/social-links-profile
This project is a solution to the Social Links Profile challenge by Frontend Mentor. It involves creating a responsive profile card with social links and user information. Key features include interactive hover and focus states, use of CSS custom properties for styling, and ensuring the design is responsive across different devices.
css frontend-mentor frontend-mentor-challenge html
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/recipe-page
Recipe Page Solution is a front-end web project that displays a recipe with a clean, responsive layout. It includes preparation time, ingredients, instructions, and nutritional values, all structured to meet the Frontend Mentor challenge. The design ensures compatibility across devices, providing a visually appealing and accessible user experience.
bootstrap css frontend-mentor-challenge frontendmentor-challenge html scss
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/results-summary-component
The Results Summary Component is a responsive and reusable frontend component designed to display a summary of results, such as quiz scores or assessment outcomes. Built as part of a coding challenge on Frontend Mentor, it aims to provide a clean, accessible interface that can be easily integrated into various web projects.
css frontend frontend-mentor frontendmentor-challenge html html-css-challenge scss
Last synced: 02 Mar 2025
https://github.com/yashi-singh-9/testimonials-ui-component
The Testimonials UI Component is a responsive carousel showcasing customer reviews with star ratings, author details, and profile pictures. Built with HTML, CSS (LESS), and JavaScript, it features navigation buttons and adapts to different screen sizes for a seamless user experience.
css frontend frontendpro frontendpro-challenge html javascript less less-preprocessor
Last synced: 27 Mar 2025
https://github.com/yashi-singh-9/newsletter-card-component
A responsive Newsletter Signup Card made with HTML, CSS, and JavaScript. It includes email validation, checkbox agreement, and a popup confirmation upon successful submission. Fully responsive across devices.
bootstrap css frontend frontendpro-challenge html javascript scss
Last synced: 20 Mar 2025
https://github.com/yashi-singh-9/accordion-component
The Accordion Component is an interactive FAQ section built with HTML, CSS, and JavaScript. It features expandable answers with smooth transitions and animated icons (plus to times). Each item has a unique color scheme and the layout is fully responsive, ideal for space-efficient content display on websites and apps.
css dom-manipulation frontend-mentor html javascript
Last synced: 20 Mar 2025
https://github.com/yashi-singh-9/contact-us-form---frontendpro-solution
A simple, responsive contact form built with HTML, SCSS, and JavaScript for the FrontendPro challenge. This form includes client-side validation, error handling, and a modern design with a gradient background and smooth UI elements.
css frontend frontend-pro html javascript scss scss-framework
Last synced: 20 Mar 2025
https://github.com/yashi-singh-9/profile-card-component
This is a solution to the Profile Card Component challenge on Frontend Mentor, where the task was to build a responsive profile card component based on a provided design. The project demonstrates skills in HTML, CSS, and responsive design, utilizing CSS custom properties and Flexbox for layout and styling.
css frontend frontend-mentor frontendmentor-challenge html scss scss-framework
Last synced: 03 Apr 2025
https://github.com/yashi-singh-9/tabs
The Tabs project offers a straightforward tabbed interface for navigating between content sections on a web page, using HTML, CSS, and JavaScript. It enables seamless content switching without page reloads.
css dom dom-manipulation html html-css-javascript javascript roadmap-project
Last synced: 03 Apr 2025
https://github.com/yashi-singh-9/3-column-preview-card-component
This project solves the Frontend Mentor's 3-column preview card challenge, featuring a responsive layout with cards that include images, titles, descriptions, and call-to-action buttons. Built with HTML and CSS, it uses Flexbox and CSS Grid to ensure a dynamic user experience on various screen sizes.
css frontend frontend-mentor frontendmentor frontendmentor-challenge html html-css-challenge
Last synced: 03 Apr 2025