Web Development

Food Log Widget

2025 Tauri HTML CSS JavaScript

Overview

Built as a gift for Ethan, this pixel-art desktop food logging widget was designed to make daily meal and symptom tracking quick, low-friction, and actually pleasant to use. The app runs as a native desktop application using the Tauri framework, which wraps vanilla HTML, CSS, and JavaScript in a lightweight native shell no Electron, no heavy runtime, just a small self-contained executable.

The pixel-art visual style was chosen deliberately to make the interface feel approachable and distinct from clinical health apps. Everything runs entirely client-side with no backend, no accounts, and no data leaving the device.

View on GitHub
Food log widget demo

Features

  • Log meals across four categories: breakfast, lunch, dinner, and snacks
  • Check off common food triggers from a curated list to track potential dietary sensitivities
  • Complete a symptom checklist after each meal to record how you felt
  • Export a CSV file of all logged entries for review, analysis, or sharing with a healthcare provider
  • Fully offline and private no internet connection required, no data sent anywhere
Food log widget  screen 1
Food log widget  screen 2
Food log widget  screen 3
Food log widget  screen 4

App screenshots

Technologies

  • Tauri Rust-based framework that packages web technologies into a native desktop app with a minimal footprint
  • Vanilla HTML, CSS & JavaScript No frontend frameworks; all UI logic written by hand
  • Pixel fonts & sprite art Custom pixel-art aesthetic throughout the interface
  • Blob API Used for client-side CSV file generation and download without a server

Tools and Technologies

Tauri HTML CSS JavaScript Pixel Art Design CSV Export Blob API