A clean, minimalist notepad application built with only HTML and CSS. This project demonstrates the power of modern CSS by implementing a fully functional dark mode theme toggle and a print-ready layout without a single line of JavaScript for its core functionality.
Here's a look at the application in action.
- Ruled Paper Effect: The text area mimics a classic ruled notepad using a repeating-linear-gradient background.
- JavaScript-Free Theme Toggle: A seamless switch between light and dark themes is achieved using a hidden checkbox and the :checked pseudo-class in CSS.
- Print-Ready: Includes a styled print button and uses @media print rules to hide the UI, ensuring only the note content is printed.
- Fully Responsive: The layout is designed to be functional and look great on all screen sizes, from mobile devices to desktops.
- Lightweight & Fast: With no JavaScript dependencies for the main features, the application is extremely fast and lightweight.
- HTML5: For the structure and content of the application.
- CSS3: For all styling, responsiveness, animations, and the theme-switching logic.