Free Espresso Portafilter Headspace Calculator & Penny Test

Free Espresso Portafilter Headspace Calculator & Penny Test
gemini-3.0-flash logogemini-3.0-flash

Calculate your espresso portafilter headspace with this free online tool. Use the penny test method to optimize your puck density for better coffee extraction.

Built by@Akhenaten

What This App Does

Calculate your espresso portafilter headspace with this free online tool. Use the penny test method to optimize your puck density for better coffee extraction. — generated by gemini-3.0-flash and published by @Akhenaten on Slopstore. Categorized under Utility, this app is part of Slopstore's curated collection of AI-generated tools and experiments. Run it free in your browser. No installation needed.

AI Generation Prompt

Application Overview

This is a specialized, interactive utility for home baristas designed to calculate and visualize espresso portafilter headspace. It replaces guesswork with data-driven modeling. The app calculates the remaining volume in the basket after tamping, helping users prevent puck-to-screen contact.

Technical Specification & Architecture

  • Single-File Architecture: The entire application must be contained in a single index.html file, including CSS and JavaScript. No external build processes allowed.
  • Storage Policy: This application must perform all calculations in memory (RAM). Absolutely no localStorage, sessionStorage, or cookies are to be used. Settings are reset on page reload.
  • Compatibility: Designed for browsers that support modern HTML5 Canvas, CSS Grid, and Flexbox. The application should be responsive and work across desktop and mobile devices.
  • Security: The app will run within a sandboxed iframe. Ensure no alert(), prompt(), or confirm() calls are used. Replace these with standard HTML/CSS modals or inline notification banners.

Feature List

  1. Dynamic Parameter Inputs:
    • Basket Diameter (mm): Numerical input with validation.
    • Basket Depth (mm): Numerical input with validation.
    • Dose (g): Numerical input for the coffee weight.
    • Roast Level (Selection): Dropdown for Light, Medium, Dark (which maps to density coefficients).
  2. Live Visualizer:
    • A real-time cross-section representation of the portafilter basket.
    • A draggable or animated representation of a 'penny' that indicates clear, borderline, or touch zones.
  3. Result Interpretation:
    • Instant calculation of headroom (mm).
    • Color-coded status indicator (Green for optimal, Yellow for borderline, Red for risk of channeling).
  4. Responsive Layout:
    • Side-by-side controls and visualization on desktop.
    • Stacked layout on mobile for ease of use in the kitchen.

UI & Design Specifications

  • Aesthetic: Clean, minimalist 'SaaS' look. Light mode only. Use soft drop shadows, rounded corners (8px/12px), and clear, modern typography (sans-serif, e.g., Inter or system font).
  • Color Palette:
    • Background: #f8fafc (Cool Grey 50)
    • Primary Action Button: #0f172a (Slate 900) with hover state #1e293b
    • Accent (Good/Optimal): #22c55e (Emerald 500)
    • Warning (Caution): #eab308 (Yellow 500)
    • Error (Too Tight): #ef4444 (Red 500)
    • Card Background: #ffffff
  • Animations:
    • Smooth transition for input changes: 200ms ease-in-out.
    • Canvas rendering for the visualizer to ensure fluid updates during user interactions.
  • Responsiveness: Use CSS media queries to ensure inputs remain tappable (minimum 44px height) on mobile devices.

Directives for Developer

  1. Vanilla JS: Do not use frameworks like React, Vue, or Angular. Keep the DOM interaction logic clean and modular.
  2. No Brand Name: Ensure the app title and labels remain purely functional.
  3. No Footer: Ensure the UI ends naturally with a clean border/layout closure.
  4. Accessibility: Ensure all inputs have proper labels (<label>) and contrast ratios meet WCAG 2.1 AA standards.
  5. Performance: Ensure the simulation runs instantly without lag on-screen 'loading' jitter.

Spread the word

11Total Views
gemini-3.0-flash logogemini-3.0-flash
AI Model

Files being used

index.html
10.2 KB
#espresso portafilter headspace calculator#coffee puck density tool#penny test espresso#espresso machine basket depth#coffee extraction optimization#home barista espresso tools

Frequently Asked Questions

Everything you need to know about using this application.

What is the penny test for espresso?

The penny test is a simple diagnostic method used by home baristas to determine if there is enough headspace between the coffee puck and the dispersion screen of the espresso machine. By placing a coin on top of the tamped coffee puck and locking the portafilter into the group head, you can see if the coin leaves an indentation when removed. This indicates whether the coffee puck is expanding into the screen or if there is sufficient room for proper water distribution. Having too much or too little headspace can significantly impact your espresso extraction quality. If the puck is too close to the screen, it can cause channeling, resulting in bitter or uneven shots. Conversely, if there is too much headspace, the puck might not be stable, leading to inconsistent pressure and poor flavor development.

How does this espresso headspace calculator work?

This tool uses physical dimensions and density estimations to simulate the relationship between your coffee dose and your specific portafilter basket size. By entering the basket depth, diameter, and your target coffee dose, the calculator estimates the vertical gap remaining in the basket. It visualizes this data through a dynamic representation, helping you predict if a coin would touch the shower screen before you even pull the shot. The calculation assumes a standard puck density derived from typical roast profiles, which allows it to estimate the displacement of the ground coffee. While it cannot replace the tactile feedback of the physical penny test, it acts as a reliable baseline for adjusting your dose to achieve the industry-standard headspace of approximately 2mm to 4mm.

Why is proper headspace important for espresso?

Proper headspace is critical for ensuring that the pressurized water from the group head can distribute evenly across the surface of the coffee puck. If the puck is packed too tightly against the dispersion screen, the water will be forced through unevenly, leading to 'channeling' where the water finds the path of least resistance. This results in an uneven extraction where parts of the coffee are over-extracted and others remain under-extracted. On the other hand, sufficient headspace allows the coffee puck to bloom properly during the initial infusion phase. This 'breathing room' ensures that the water hydrates the grounds uniformly before full pressure is applied. Maintaining the correct headspace ensures consistency in your shot quality, allowing you to dial in your espresso recipes with much higher precision.

Can I use this tool for different roast levels?

Yes, this tool includes a variable for roast level because coffee density changes significantly between light and dark roasts. Darker roasts are generally less dense and more porous, meaning the same weight of grounds will occupy more volume in the basket compared to a light roast. This tool accounts for these density differences when calculating the predicted height of the puck. Adjusting for roast level is essential because a 19-gram dose of light roast will behave differently than a 19-gram dose of dark roast within the same basket. By selecting the correct roast profile in the application, the headspace calculation is adjusted to reflect the expected displacement, providing a more accurate estimation of the clearance available under your espresso machine's shower screen.

Related Applications

Discover more free AI apps on Slopstore — the community platform for hosting AI-generated web applications.