Venturi Tube Pressure Differential Calculator Specification

1. Overview

A highly interactive, single-page web application designed to compute the pressure differential ($ΔP$) and throat velocity ($v_2$) of a fluid passing through a Venturi tube. The tool is intended for engineers, physics students, and researchers needing quick, accurate calculations based on Bernoulli's principle.

2. Technical Features

• Real-time Engine: Instant calculation using pure JavaScript, reacting to input events on all fields.
• Unit Flexibility: Toggle between SI (mm, kg/m³, m/s) and Imperial (inches, lb/ft³, ft/s) units.
• Fluid Presets: A dropdown selection for common fluids (Water, Air, Oil, Ethanol) that automatically populates the density field.
• Input Validation: Real-time visual feedback for invalid entries (e.g., throat diameter cannot be larger than inlet diameter).
• Visual Schematic: A responsive SVG representation of a Venturi tube that highlights the inlet and throat sections.

3. UI Layout

• Header: Clean, minimal application title with a brief subtitle explaining the engineering purpose.
• Input Section (Left/Top):
  • Grouped inputs: Pipe Dimensions, Fluid Properties, Flow Velocity.
  • Clean, modern text inputs with floating labels.
  • Unit toggle buttons with active/inactive states.
• Results Section (Right/Bottom):
  • Prominent display of calculated Pressure Differential and Throat Velocity.
  • Derived calculations (Flow Rate if velocity is known) clearly highlighted in high-contrast text.
• Visualization Area: An SVG area showing the pipe narrowing. As the user changes the inlet-to-throat ratio, the drawing dynamically scales the constriction.

4. Color Palette

• Primary Blue: #2563EB (Primary actions and results)
• Background: #F8FAFC (Soft, clean off-white)
• Card Background: #FFFFFF (Solid white with subtle drop-shadow)
• Text: #1E293B (Dark slate for high readability)
• Border/Subtle: #E2E8F0 (Light grey for input separators)

5. Animations & Interaction

• Micro-interactions: Subtle CSS transition (all 0.2s ease) on inputs when they receive focus.
• Results Update: Use a fade-in animation or a simple scale-up on result numbers when values change to draw attention.
• Error Feedback: Inputs flash a soft error border color if the user provides physically impossible parameters (e.g., negative diameter).

6. Developer Directives (CRITICAL)

• Architecture: Must be a single index.html file containing CSS and JS.
• Sandbox Constraints:
  • NO localStorage, sessionStorage, or cookies. Calculations must exist in volatile memory only.
  • NO alert(), confirm(), or prompt(). All UI feedback must be rendered as standard HTML elements.
• Dependencies: Use CDN links for any icons (e.g., FontAwesome/Lucide) or utility CSS (e.g., Tailwind CSS via CDN) to keep it lightweight.
• Performance: Optimize for zero-latency math operations. Ensure the DOM remains responsive during calculation cycles.