Today i wanna going to show you how to make a camera by using HTML & CSS in 3D effects


1st Output :

2nd Output :

3rd Output :

4th Output :


                    camera is an optical instrument used to capture an image. At their most basic, cameras are sealed boxes (the camera body) with a small hole (the aperture) that allow light in to capture an image on a light-sensitive surface (usually photographic film or a digital sensor). Cameras have various mechanisms to control how the light falls onto the light-sensitive surface. Lenses focus the light entering the camera, the size of the aperture can be widened or narrowed to let more or less light into the camera, and a shutter mechanism determines the amount of time the photo-sensitive surface is exposed to the light.


                    The word camera comes from camera obscura, which means "dark chamber" and is the Latin name of the original device for projecting an image of external reality onto a flat surface. The modern photographic camera evolved from the camera obscura. The functioning of the camera is very similar to the functioning of the human eye. The first permanent photograph was made in 1825 by Joseph Nicéphore Niépce.


                A flash, which provides a short burst of bright light during the exposure, is a commonly used artificial light source in photography. Most modern flash systems use a battery-powered high-voltage discharge through a gas-filled tube to generate bright light for a very short time (1/1,000 of a second or less).

Many flash units measure the light reflected from the flash to help determine the appropriate duration of the flash. When the flash is attached directly to the camera—typically in a slot at the top of the camera (the flash shoe or hot shoe) or through a cable—activating the shutter on the camera triggers the flash, and the camera's internal light meter can help determine the duration of the flash..


  • Create a New file and name it as camera.html
  • In this i am using internal style sheet to the html file
  • I am adding 3D effects to the camera by using CSS Animations
  • Watch that tutorial and starts to coding
  • Here is the tutorial link :  
  • I am just using sample colours to the camera, so you can add your favourite colours
  • Now the animation is to be ready
  • I hope you learned something new from this tutorial.   

Source Codes  :  

        Click to download Source file    


Post a Comment

Previous Post Next Post