Free Physics Pendulum Damping Coefficient Calculator

Overview

A high-precision, client-side web application designed to compute the damping coefficient (ζ) and logarithmic decrement (δ) of a pendulum system. This tool provides instant, visual feedback for physics students and researchers analyzing harmonic motion.

Core Features

• Input Parameter Interface: Fields for Pendulum Length (m), Acceleration of Gravity (m/s²), Initial Amplitude (rad/degrees), Final Amplitude (rad/degrees), and Number of Oscillations.
• Real-time Calculation Engine: Instant computation of Logarithmic Decrement, Damping Ratio, Damping Coefficient, and Natural Frequency.
• Dynamic Visualization: An HTML5 Canvas-based graph rendering the decay curve of the pendulum's motion, updating instantly as parameters change.
• Unit Conversion: Support for degrees and radians for angular inputs.
• Results Summary: A clean, exportable dashboard showing the calculated physics constants.

UI Layout

• Header: Clean, centered title with a descriptive tagline.
• Main Tool Area: A two-column split-pane layout:
  • Left Pane (Inputs): Grouped input fields for variables (Length, Gravity, Amplitude, Cycles). Each input features a descriptive label and an icon.
  • Right Pane (Output & Visualization): A real-time updating graph container and a result card highlighting the Damping Coefficient and Damping Ratio in large, clear typography.
• Layout Mechanics: Uses CSS Grid/Flexbox to ensure the app collapses to a single-column layout on mobile devices.

Design System & Aesthetics

• Color Palette: A professional, light-mode-only scheme:
  • Primary Action: #2563EB (Electric Blue)
  • Background: #F8FAFC (Soft White)
  • Surface: #FFFFFF (Pure White) with subtle shadow-sm (0 1px 2px rgba(0,0,0,0.05))
  • Text: #1E293B (Dark Slate)
  • Accent: #64748B (Muted Slate)
• Animations: Subtle transition effects using transition: all 0.3s ease; for input interactions and graph data updates. No jarring movements.

Technical Constraints & Directives

• Single File: All HTML, CSS, and Vanilla JS must exist within a single index.html file.
• Sandbox Safety: DO NOT use localStorage, sessionStorage, or cookies. Use variable memory only.
• No External Dependencies: Use CDN-hosted resources only (e.g., Tailwind CSS via CDN, Chart.js for graph visualization).
• Accessibility: Ensure all inputs have proper aria-labels for screen readers.
• Responsive: Ensure the graph canvas handles window resizing by dynamically redrawing on the resize event.
• Performance: Calculations should occur in real-time, using requestAnimationFrame for the visualization updates to ensure smooth performance.