Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Interactive Calculator

A creative calculator project built with HTML, CSS and JavaScript.

This is not just a simple calculator.
It includes different color themes, keyboard support, responsive design and a funny joke mode.

Features

  • Basic calculator operations
  • Keyboard support
  • Color theme switcher
  • Responsive layout
  • Draggable calculator on desktop and tablet
  • Fixed centered calculator on mobile
  • Funny joke mode
  • Mobile joke animation
  • Clean UI with custom CSS variables

Technologies

  • HTML5
  • CSS3
  • JavaScript
  • Git / GitHub

Live Demo

Open Live Demo

Project Purpose

This project was created as part of my frontend learning journey.

My goal was to practice JavaScript logic, CSS styling, responsive design and interactive UI behavior. I also wanted to make the project more creative and playful instead of building only a standard calculator.

What I learned

  • How to build calculator logic with JavaScript
  • How to work with DOM events
  • How to add keyboard input
  • How to create multiple themes with CSS variables
  • How to make a responsive layout
  • How to add simple animations
  • How to organize a small frontend project

Themes

Default Theme

Default Theme

Blue Theme

Blue Theme

Green Theme

Green Theme

Purple Theme

Purple Theme

Joke Theme

Joke Theme

Author

Regina