DEV Community: Rudi K. 🧠

Building a lightweight, offline screenshot beautifier in Rust

Rudi K. 🧠 — Tue, 07 Apr 2026 08:13:19 +0000

If you're a developer like me who genuinely enjoys working on a PC, you might relate to a specific feeling. Even though Windows itself has really grown into its polish over the years, a lot of the third-party utility apps haven't quite caught up. We have tools that are incredibly powerful, but they often focus purely on function and miss out on that clean, modern aesthetic you'd expect in 2026.

Over the past year, I built two open-source projects, LeedPDF and Glucose Video Player. They ended up getting way more love than I ever expected, especially from the PC crowd. That response validated something I've felt for a long time: a lot of us like being on Windows, but we are starved for high-quality, UX-focused desktop apps.

The acceptance of those utility tools (which I originally just built for myself) got me thinking about other areas of my daily workflow that were overdue for an upgrade.

Sharing screenshots was one of those things for me. From my college days until now, whether I needed to add a screenshot to a presentation, share it on Slack with the team, post on social media, or drop it into documentation. I just never liked looking at raw, unpolished screenshots. But I was also tired of having to open up Figma or use clunky software just to add a nice background and some basic padding.

That’s why I started building DoublShot.

What is DoublShot?

It’s a minimalist tool that sits in your tray and replaces your default snipping workflow. You take a screenshot, and it automatically makes it look polished, cleaner, and presentation-ready by adding perfect padding, a drop shadow, and a complementary background gradient that matches the colors in your image.

In a nutshell, I tried my best to keep it as simple, minimalist, and UX-friendly as I possibly could.

The Tech & The Philosophy

I built this with a few strict rules:

1. It has to be incredibly fast.
I wrote the core of DoublShot in Rust. This means the memory footprint is tiny and the performance is unmatched. There's near-zero latency from the moment you hit the shortcut to the moment the styled image hits your clipboard.

2. It must be completely private.
No data leaves your PC. Period. It is an offline-first, local binary. I hate tools that require you to upload your clipboard to the cloud just to add a background.

3. No SaaS / Subscription bloat.
I am exhausted by subscription fatigue. DoublShot has a generous free version, but even the premium version is not a SaaS. You buy a license, and you own the software for life. It's yours to keep, and you'll still receive updates.

I'd love your feedback

Building this has been a really fun dive into desktop app development and UX design.

I’d love to have the dev.to community try it out. If you're on Windows and want to upgrade how you share visual updates, you can grab it for free here:

👉 doublshot.com

Please share any valuable feedback, bug reports, or feature requests! Your input on my past projects helped shape them immensely, and I'm hoping to do the same here to refine DoublShot for everyone.

Building A Keyboard-First Video Player with Svelte & Rust

Rudi K. 🧠 — Fri, 24 Oct 2025 04:33:06 +0000

Until about five months ago, I didn’t even have a single public repo on GitHub.
Every project I’d built was closed-source, mostly private tools or experimental stuff that never saw the light of day.

But at some point, I realized how much of what I use every day exists because someone decided to make their work open.
So I figured, why not give back?

That led to Cristalyse and then LeedPDF, which, funnily enough, ended up being my fastest-growing app ever.

LeedPDF crossed 100 GitHub stars faster than I ever expected, and that tiny milestone made me want to keep going.

rudi-q / leed_pdf_viewer

Open-source PDF annotation and drawing tool built for privacy. Sketch and annotate PDFs with natural pen-like precision, drawing tablet support. SvelteKit + Tauri.

LeedPDF - Free PDF Annotation Tool

Add drawings and notes to any PDF.

Works with mouse, touch, or stylus - completely free and private.

A modern, open-source PDF annotation tool that runs entirely in your browser

Transform any PDF into an interactive canvas. Draw, annotate, and collaborate without uploading your documents to external servers.

Try it now → | Report Issues | Contribute

✨ Features

🔍 PDF Search & Discovery

Web-wide PDF search powered by Brave Search API
Direct PDF opening from search results
Smart filtering for PDF documents only
Pagination through search results
Real-time search with instant results
Setup guide: See docs/SEARCH_FEATURE.md for configuration

🎨 Drawing & Annotation

Freehand drawing with customizable pencil and highlighter tools
Shape tools including rectangles, circles, arrows, and stars
Text annotations with inline editing
Sticky notes for quick comments
Smart eraser that removes intersecting elements

📱 Universal Access

Works on any device -…

View on GitHub

I’ve always loved Flutter, but working with Svelte on LeedPDF genuinely made me fall in love with it, it’s just so reactive, elegant, and fun to build with. And pairing that with Rust, well… Rust makes everything snappy.

Why I Built Glucose

As someone who’s used VLC for years, I’ve always respected how powerful it is, it’s the Swiss Army knife of video players.
But let’s be honest: it doesn’t exactly look like something from 2025.

It’s cluttered, it’s got buttons for things I never touch, and it feels… old.
I wanted a video player that’s private, open source, and brutally minimal, something that just plays my videos and gets out of the way.

That’s how Glucose started.
A zero-UI video player, simple, focused, and lightweight.
The installer? Just 4MB.

Rust helped a lot with performance, and Svelte handled the rest with elegance.

The Stack

SvelteKit + Rust + Tauri became my go-to stack for Glucose.

SvelteKit for the UI, reactive, clean, and a joy to build with.

Rust for performance-critical tasks and local file handling.

Tauri for packaging everything into a native desktop experience that stays tiny.

Electron would’ve made the build 10x heavier, and Flutter (as much as I love it) wasn’t the right fit for a desktop-first app.

Svelte + Rust feels underrated, especially for apps that need both high reactivity and low-level performance. It’s honestly one of the smoothest pairings I’ve worked with.

Architecture Overview

Here’s the basic flow:

The frontend (SvelteKit) handles the player UI and keyboard interactions.

The backend (Rust via Tauri) deals with video decoding, file access, and media control.

Communication between them happens through Tauri’s command bridge.

It’s clean, fast, and predictable.
Rust takes care of the heavy lifting, while Svelte keeps the experience buttery smooth.

Keyboard-First Experience

Glucose is all about low cognitive load.
I designed it so you never have to touch your mouse, not even once.
You can:

- Press Space or K to play/pause
- ← and → to seek backward/forward
- K to toggle playback speed
- Jump to percentage (0% - 90%): 0 - 9
- / to open a command overlay for quick actions

Once you get used to it, you realize how much friction you were tolerating in other players.

Offline-First and Fast

No telemetry. No tracking. No analytics.
Everything Glucose does stays on your device.

It runs entirely offline and launches almost instantly.
That’s the beauty of combining Rust’s efficiency with Svelte’s reactivity, the whole app just feels effortless.

rudi-q / glucose_media_player

Ultra-lightweight, video player for Windows with AI powered subtitle generation. Tauri + Svelte

A Sleek & Lightweight VLC Alternative with On-Device AI Subtitle

✨ Features

🎬 Cinematic Mode

Enjoy your media with a beautifully blurred background and centered content for truly immersive viewing.

🖼️ Universal Media Support

Videos: MP4, MKV, AVI, MOV, WebM, WMV, FLV, M4V
Subtitles: SRT, VTT, ASS, SSA, SUB

🎯 Minimal by Design

No clutter, no distractions. Just your content and elegant controls that appear when you need them.

⚡ Blazingly Fast

Built with Rust and Tauri for native performance with a tiny footprint.

🎮 Keyboard-First

Complete keyboard navigation for power users who value efficiency.

📂 Smart Gallery

Automatically scans and displays your recent videos in a beautiful grid layout.

🎨 Modern Interface

Frameless, transparent window design
Smooth animations and transitions
Audio output device selection
Volume control with visual feedback
Timeline scrubbing with video preview
Fullscreen and cinematic viewing modes

📥 Installation

Pre-built Binaries

Download the latest release…

View on GitHub

Everything’s open-source under MPL.
👉 github.com/rudi-q/glucose_media_player

Closing Thoughts

Five months ago, I didn’t even know what it felt like to share my work openly.
Now, I can’t imagine not doing it.

Building Glucose reminded me that open source doesn’t have to be massive, it just has to be honest.
Sometimes, it’s about building the small, quiet things that make your day smoother.

Glucose is one of those things for me.
Try it, it's FREE :)

glucose.media

Cristalyse - The Only Flutter Chart Package with MCP Support Built In

Rudi K. 🧠 — Mon, 08 Sep 2025 14:02:39 +0000

How Cristalyse is pioneering AI-assisted chart development in Flutter

As Flutter developers, we've all been there: you're deep in the flow, building out your data visualization, when you hit a wall. "How do I add dual Y-axes again?" or "What was the syntax for that bubble chart mapping?" You alt-tab to docs, lose your train of thought, and your productivity takes a hit.

What if your AI coding assistant could answer these questions directly in your IDE, with complete knowledge of your chart library's API? That's exactly what we've built with Cristalyse v1.6.1 - the first Flutter chart package with built-in Model Context Protocol (MCP) support.

What Makes This Groundbreaking?

MCP isn't just another feature - it's a fundamental shift in how we think about developer tooling. Instead of treating documentation as a separate resource, MCP creates a direct bridge between your coding environment and the knowledge base of your tools.

For Flutter chart development, this means:

Zero context switching between IDE and documentation
Instant access to working code examples
Real-time guidance on complex APIs like grammar of graphics
Contextual help that understands what you're trying to build

The Technical Foundation: Why Charts Need This Most

Building charts isn't like implementing typical Flutter widgets. Chart libraries, especially ones implementing grammar of graphics (like Cristalyse), have inherently complex APIs:

// This is just a simple scatter plot, but look at the API surface:
CristalyseChart()
  .data(salesData)
  .mapping(x: 'quarter', y: 'revenue', color: 'region', size: 'growth')
  .geomPoint(size: 8.0, alpha: 0.7, shape: PointShape.circle)
  .scaleXContinuous(domain: [0, 4])
  .scaleYContinuous(format: NumberFormat.currency())
  .scaleColorDiscrete(palette: CustomPalette.business)
  .scaleSizeLinear(range: [5, 20])
  .theme(ChartTheme.professional())
  .animate(duration: Duration(milliseconds: 1200))
  .interaction(
    tooltip: TooltipConfig(
      builder: (point) => Container(
        padding: EdgeInsets.all(8),
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text('Q${point.getValue('quarter')}'),
            Text('Revenue: ${currencyFormat.format(point.getValue('revenue'))}'),
            Text('Region: ${point.getValue('region')}'),
          ],
        ),
      ),
    ),
  )
  .build();

That's a lot of moving parts. And this is still a relatively simple example. When you factor in:

Multiple geometry layers
Custom scales and transformations
Complex interaction handling
Animation coordination
Theme customization
Data preprocessing

The cognitive load becomes substantial. This is where AI assistance becomes genuinely valuable, not just convenient.

How MCP Works Under the Hood

The Model Context Protocol creates a standardized way for AI applications to connect to external knowledge sources. Here's the technical flow:

graph LR
    A[Your IDE] --> B[AI Assistant]
    B --> C[MCP Client]
    C --> D[HTTPS Request]
    D --> E[Cristalyse MCP Server]
    E --> F[Documentation DB]
    F --> E
    E --> D
    D --> C
    C --> B
    B --> A

When you ask your AI assistant about Cristalyse:

Query Processing: Your question gets sent to the AI assistant
MCP Resolution: The assistant identifies this as a Cristalyse-related query
Server Connection: Makes a secure HTTPS request to https://docs.cristalyse.com/mcp
Knowledge Retrieval: Our MCP server returns relevant documentation, examples, and API references
Response Generation: The AI assistant combines this knowledge with its understanding to give you a complete answer

Setting Up MCP: The Developer Experience

The setup is intentionally frictionless. For most AI coding assistants, it's just adding one line to your MCP configuration:

Cursor/Windsurf/Warp:

{
  "mcpServers": {
    "cristalyse_docs": {
      "url": "https://docs.cristalyse.com/mcp"
    }
  }
}

Claude Code CLI:

claude mcp add --transport http cristalyse_docs https://docs.cristalyse.com/mcp

Claude Web/Desktop:

Add a custom connector with URL: https://docs.cristalyse.com/mcp

That's it. No API keys, no authentication complexity, no additional dependencies.

Real-World Impact: Before vs After

Let me show you the difference with a concrete example. Say you want to build a dual Y-axis chart comparing revenue and customer count over time.

Before MCP:

Remember that Cristalyse supports dual Y-axis (if you remember at all)
Open documentation in browser
Search for "dual Y-axis" or "secondary axis"
Find the relevant API methods
Look for code examples
Copy/paste and adapt to your data
Debug inevitable syntax issues
Repeat for styling, interactions, etc.

With MCP:
Simply ask in your IDE: "Show me how to create a dual Y-axis chart with Cristalyse where left axis shows revenue and right axis shows customer count, both animated"

Your AI assistant responds immediately:

CristalyseChart()
  .data(businessData)
  .mapping(x: 'month', y: 'revenue', y2: 'customers')
  .geomLine(color: Colors.blue)
  .geomLine(yAxis: YAxis.secondary, color: Colors.green) 
  .scaleYContinuous(
    format: NumberFormat.currency(),
    title: "'Revenue ($)',"
  )
  .scaleY2Continuous(
    format: NumberFormat.decimalPattern(),
    title: "'Customer Count',"
  )
  .theme(ChartTheme.business())
  .animate(duration: Duration(milliseconds: 1500))
  .build();

The AI can even explain the key concepts: "The y2 mapping creates a secondary Y-axis, and yAxis: YAxis.secondary tells the second line geometry to use that axis..."

Why Grammar of Graphics + AI is Powerful

Cristalyse implements the grammar of graphics paradigm (think ggplot2 for Flutter). This creates an interesting synergy with AI assistance:

Composable APIs benefit from guided assembly. Grammar of graphics is all about layering components:

Data + Mappings + Geometries + Scales + Themes = Chart

AI can help you navigate these layers intelligently:

// Ask: "I have sales data with categories, how do I make a stacked bar chart?"
// AI understands you need:

CristalyseChart()
  .data(salesData)
  .mapping(x: 'quarter', y: 'amount', fill: 'category')
  // ^ AI knows 'fill' creates the stacking
  .geomBar(position: Position.stack)
  // ^ AI knows Position.stack is needed for stacking
  .scaleYContinuous(format: NumberFormat.currency())
  .scaleColorDiscrete(palette: CustomPalette.categorical)
  .theme(ChartTheme.minimal())
  .build();

Complex data transformations become approachable. When you're dealing with:

Multi-dimensional data mapping
Statistical transformations
Custom scales and color palettes
Animation coordination

Having an AI assistant that understands the grammar makes these advanced features accessible to developers who might otherwise stick to basic charts.

The Technical Implementation: Building an MCP Server

For other package maintainers interested in implementing MCP support, here's what's involved:

1. MCP Server Architecture
Our MCP server is a lightweight HTTP service that provides:

Document search and retrieval
Code example matching
API reference lookup
Context-aware responses

2. Documentation Structure
We structure our docs for optimal MCP consumption:

## Bubble Charts
Description: Multi-dimensional data visualization...

Basic Usage

CristalyseChart()
  .data(data)
  .mapping(x: 'x', y: 'y', size: 'size')
  .geomBubble()
  .build();

3. Response Optimization
The MCP server returns structured responses that AI assistants can parse effectively:

Code examples with syntax highlighting
API references with parameter details
Best practices and common patterns
Error handling guidance

Performance Considerations

You might wonder about the performance impact of MCP queries. In practice:

Latency: ~200-500ms for most queries (similar to searching docs manually)
Caching: Responses are cached by AI assistants
Offline fallback: AI assistants still have their base training knowledge
Rate limiting: Built-in protections prevent abuse

The performance is more than acceptable for the productivity gains you get.

Future Implications: The AI-Native Development Era

MCP support in Cristalyse isn't just about convenience - it's a glimpse into how developer tooling will evolve:

Domain-Specific AI Assistance: Instead of generic coding help, you get expert-level guidance in specialized domains like data visualization.

Contextual Code Generation: AI assistants can generate more sophisticated code because they understand the full API surface and best practices.

Interactive Documentation: The line between documentation and development environment disappears.

Collaborative Development: AI becomes a true pair programming partner that knows your tools as well as you do.

Real-World Examples

Here are some queries developers are already using:

Complex Data Handling:
"I have time series data with multiple metrics. How do I create a line chart where each metric has its own Y-axis scale and color?"

Performance Optimization:

"What's the best way to handle large datasets in Cristalyse? Show me data downsampling and virtualization techniques."

Advanced Interactions:
"How do I implement custom tooltips that show related data when hovering over a point in a scatter plot?"

Theme Customization:
"Create a dark theme for my charts that matches my app's brand colors with proper contrast ratios."

Getting Started Today

Ready to experience AI-assisted chart development? Here's your quickstart:

Install Cristalyse: flutter pub add cristalyse
Set up MCP in your AI coding assistant (choose one):

   // Cursor/Windsurf/Warp
   "cristalyse_docs": {"url": "https://docs.cristalyse.com/mcp"}

   # Claude Code CLI
   claude mcp add --transport http cristalyse_docs https://docs.cristalyse.com/mcp

Start building: Ask your AI assistant anything about Cristalyse
Share your experience: We're actively improving based on developer feedback

What's Next?

This is just the beginning. We're working on:

Enhanced AI Training: Better understanding of chart design principles and data visualization best practices.

Interactive Examples: AI-generated examples that adapt to your specific data structure.

Performance Guidance: AI assistant that can analyze your chart code and suggest optimizations.

Integration Recommendations: Smart suggestions for integrating charts with your existing Flutter app architecture.

The Bigger Picture

Cristalyse's MCP integration represents a new category of developer tooling: AI-native libraries. These aren't just packages with good documentation - they're designed from the ground up to work seamlessly with AI development workflows.

As the Flutter ecosystem evolves, I believe we'll see more packages adopting similar approaches. The combination of powerful, well-designed APIs and AI assistance that deeply understands those APIs will define the next generation of developer productivity tools.

The question isn't whether AI will change how we write code - it's whether our tools will evolve to make that change as powerful as possible.

Want to try Cristalyse with MCP support? Check out our setup guide and start building charts that write themselves.

Links:

Have you tried AI-assisted development with domain-specific tools? What has your experience been? Let me know in the comments!

7 Reasons Flutter Devs Should Use Cristalyse for Charts

Rudi K. 🧠 — Fri, 05 Sep 2025 10:40:20 +0000

If you’re a Flutter developer building dashboards, analytics apps, or reporting tools, and you often deal with large datasets, you’ll know how tricky it can be to find a charting library that balances ease of use, performance, and flexibility.

That’s the gap I tried to solve when building Cristalyse. Here are 7 reasons you might find it useful:

1. Simple Grammar of Graphics

Cristalyse uses a grammar of graphics approach (inspired by ggplot). Instead of wiring endless widget configs, you describe what you want:

CristalyseChart()
  .data(data)
  .mapping(x: 'month', y: 'revenue', color: 'region')
  .geomBar()
  .theme(ChartTheme.cyberpunk())
  .build();

Readable, customizable, and much closer to how you think about data.

2. Handles 50k+ Data Points Smoothly

Performance was a big focus. Cristalyse stays responsive even when plotting tens of thousands of data points, so you don’t have to cut corners.

3. Built-In Animations and Interactivity

You don’t need extra packages to get the basics right:

Smooth animations
Interactive Panning
Tooltips, legends, theming

4. 15+ Chart Types

Bar, line, area, scatter, bubble, heatmaps, grouped bars, stacked bars — and each one is customizable.

5. Advanced Features When You Need Them

Multiple axes, categorical coloring, bubble sizing, heatmaps. These are supported natively, so you won’t have to hack your way around them.

6. Open Source Under MIT

Cristalyse is open source under the MIT license, so you can use it freely in commercial apps without restrictions.

7. Clear, Practical Documentation

The docs are written to be straightforward and example-driven, so you can get comfortable in a short amount of time without a steep learning curve.

Bonus: GitHub Discussions

rudi-q / cristalyse

High-performance data visualization library for Flutter with native rendering and cross-platform support

The grammar of graphics visualization library that Flutter developers have been waiting for.

Finally, create beautiful data visualizations in Flutter without fighting against chart widgets or settling for web-based solutions.

Visit our complete documentation for step-by-step guides, interactive examples,
and everything you need to master data visualization in Flutter.

Comprehensive guides, examples, and API reference

🤖 AI-Powered Development

Cristalyse Docs now has MCP server which you can connect to your AI coding assistant (Cursor, Windsurf, Warp, Claude) for instant access to documentation while you code.

✨ Why Cristalyse?

Stop wrestling with limited chart libraries. Cristalyse brings the power of grammar of graphics (think ggplot2) to Flutter with buttery-smooth 60fps animations and true cross-platform deployment.

🎨 Grammar of Graphics API - Familiar syntax if you've used ggplot2 or plotly
🚀 Native 60fps Animations - Leverages Flutter's rendering engine, not DOM manipulation
📱 True Cross-Platform - One codebase → Mobile, Web, Desktop…

View on GitHub

If you run into questions, there’s a space on GitHub Discussions where you can ask. I’m actively maintaining Cristalyse, so feedback and issues are always welcome.

Closing Thoughts

Cristalyse is still evolving, but it’s already usable for real dashboards and applications. If you’ve been struggling with performance or complexity in other libraries, this might give you a smoother experience.

👉 Try it out:

flutter pub add cristalyse

Docs: docs.cristalyse.com
Pub Dev: pub.dev/packages/cristalyse
GitHub: github.com/rudi-q/cristalyse

Why I Chose SvelteKit for My PDF Annotation App?

Rudi K. 🧠 — Fri, 05 Sep 2025 06:59:46 +0000

LeedPDF - Draw on PDFs | Free PDF Annotation ToolLeedPDF - Draw on PDFs | Free PDF Annotation Tool

Add drawings and notes to any PDF with LeedPDF. Free, browser-based PDF annotation tool that works on any device. No uploads required - your files stay private.

leed.my

When I started building LeedPDF, my goal was simple: make working with PDFs feel less clunky and more natural. A tool where highlighting and sketching felt smooth, not like wrestling with old-school document viewers.

Choosing the right framework mattered a lot because PDF rendering is already heavy. I didn’t want the framework itself to get in the way. After trying a few options, I settled on SvelteKit. Here’s why it made sense for this project.

Performance with PDF Rendering

Working with PDFs means rendering multiple canvases, text layers, and annotations at once. Even a small amount of overhead adds up fast.

Svelte compiles components to plain JavaScript, which means smaller bundles and quicker hydration compared to frameworks that carry larger runtimes. That extra efficiency matters when you’re stacking it on top of PDF.js, which is already resource hungry.

In practice, this kept LeedPDF responsive even on low-end machines.

State Management Without Extra Libraries

A PDF annotation app has constant state updates:

Which tool is active (pen, highlight, text)
Which page you’re on
Which annotations belong to which page

Instead of wiring up a whole state library, Svelte’s built-in stores and reactive syntax were enough. Stores let me share state across components without ceremony, and reactivity worked without boilerplate.

This let me focus on annotation logic rather than Redux-style plumbing.

SSR and Client Rendering Together

Parts of the project benefit from server-side rendering (landing pages, previews) while others are purely client-side (the actual annotation workspace).

SvelteKit made it easy to mix both. I could render the marketing pages on the server for speed and SEO, while keeping the core app fully interactive in the browser.

Routing That Fits the App

LeedPDF has separate modes: view, annotate, settings. I wanted clear routes but not extra config files to maintain.

SvelteKit’s file-based routing worked well. I could set up routes like /view/[id] or /annotate/[id] quickly, and layouts helped me avoid repeating UI elements.

Integrating with PDF.js

The real backbone of the app is Mozilla’s PDF.js. Wrapping it into reusable components can get messy in some frameworks because of lifecycle quirks.

With Svelte, I could map PDF.js rendering outputs (canvas, text layers) directly into reactive components. This kept the integration clean and easier to maintain.

Developer Experience

Since LeedPDF started as a Friday hack project, speed of iteration mattered. SvelteKit, powered by Vite, gave me quick reloads and a straightforward project setup.

That low friction meant I could spend weekends adding features instead of debugging configs.

Closing Thoughts

I didn’t pick SvelteKit because it was trendy. It turned out to be the right fit because it handled the performance demands, reduced boilerplate, and played nicely with the specific needs of a PDF annotation tool.

If you’re curious about the implementation, the full source code is here 👇

rudi-q / leed_pdf_viewer

Open-source PDF annotation and drawing tool built for privacy. Sketch and annotate PDFs with natural pen-like precision, drawing tablet support. SvelteKit + Tauri.

LeedPDF - Free PDF Annotation Tool

Add drawings and notes to any PDF.

Works with mouse, touch, or stylus - completely free and private.

A modern, open-source PDF annotation tool that runs entirely in your browser

Transform any PDF into an interactive canvas. Draw, annotate, and collaborate without uploading your documents to external servers.

Try it now → | Report Issues | Contribute

✨ Features

🔍 PDF Search & Discovery

Web-wide PDF search powered by Brave Search API
Direct PDF opening from search results
Smart filtering for PDF documents only
Pagination through search results
Real-time search with instant results
Setup guide: See docs/SEARCH_FEATURE.md for configuration

🎨 Drawing & Annotation

Freehand drawing with customizable pencil and highlighter tools
Shape tools including rectangles, circles, arrows, and stars
Text annotations with inline editing
Sticky notes for quick comments
Smart eraser that removes intersecting elements

📱 Universal Access

Works on any device -…

View on GitHub

Feel free to explore (and maybe leave a star ⭐).

For anyone who just wants to try it out, the live web version is here: leed.my
.

LeedPDF is open source under AGPL, and the web version will always be free.

I Built LeedPDF - Open Source PDF Drawing & Annotation That Feels Like Sketching ✏️

Rudi K. 🧠 — Wed, 06 Aug 2025 14:29:04 +0000

I’ve always loved the feeling of scribbling on paper with a pencil, especially when reviewing documents, sketching ideas, or just making quick notes.

But every PDF annotation tool I tried felt too mechanical. Either the brush felt fake, the UI was clunky, or the entire experience was built around highlighting text rather than drawing freely. And as someone who uses a drawing tablet regularly, it always felt like these tools weren’t made for me.

// Detect dark theme var iframe = document.getElementById('tweet-1952788843855564859-558'); if (document.body.className.includes('dark-theme')) { iframe.src = "https://platform.twitter.com/embed/Tweet.html?id=1952788843855564859&theme=dark" }

So I built LeedPDF.

It’s a lightweight, open-source PDF drawing and annotation tool that feels more like sketching on paper than clicking through buttons.

rudi-q / leed_pdf_viewer

Open-source PDF annotation and drawing tool built for privacy. Sketch and annotate PDFs with natural pen-like precision, drawing tablet support. SvelteKit + Tauri.

LeedPDF - Free PDF Annotation Tool

Add drawings and notes to any PDF.

Works with mouse, touch, or stylus - completely free and private.

A modern, open-source PDF annotation tool that runs entirely in your browser

Transform any PDF into an interactive canvas. Draw, annotate, and collaborate without uploading your documents to external servers.

Try it now → | Report Issues | Contribute

✨ Features

🔍 PDF Search & Discovery

Web-wide PDF search powered by Brave Search API
Direct PDF opening from search results
Smart filtering for PDF documents only
Pagination through search results
Real-time search with instant results
Setup guide: See docs/SEARCH_FEATURE.md for configuration

🎨 Drawing & Annotation

Freehand drawing with customizable pencil and highlighter tools
Shape tools including rectangles, circles, arrows, and stars
Text annotations with inline editing
Sticky notes for quick comments
Smart eraser that removes intersecting elements

📱 Universal Access

Works on any device -…

View on GitHub

I use a drawing tablet daily, and every PDF tool I tried felt… off. Brushes were too perfect, pressure input was ignored, and the overall experience felt clunky.

I wasn’t looking for another all-in-one editor — just a space where I could mark up PDFs freely, like I do in my sketchbook.

LeedPDF is built for that.

How It Works 🤔

LeedPDF is built using SvelteKit with a custom drawing engine that supports pressure-sensitive strokes, natural brush feel, and minimal UI distraction.

It’s fully offline-ready. No logins. No syncing. Your files stay on your device.

And it’s not just a web app...

💻 LeedPDF also comes as a lightweight desktop app if you prefer working outside the browser.

✅ Features

Pressure-sensitive drawing
Natural sketch-like brush strokes
Works offline (browser & desktop)
No accounts, no tracking
Open source
Built with SvelteKit

🧪 Try It

Use it right away in your browser:
👉 https://leed.my

Or download the desktop version from the GitHub releases:
🔗 https://leed.my/downloads

Final Thoughts 💭

LeedPDF is the kind of tool I wish existed years ago — and now I use it daily.

If you prefer drawing your thoughts over typing them, or if traditional PDF tools never quite clicked for you, give it a spin.
Always open to feedback, ideas, or contributions.

I made my first game with flutter, it's open-source

Rudi K. 🧠 — Sat, 05 Jul 2025 20:57:16 +0000

made my first game with flutter 💙

it’s called tuesdae rush, a traffic sim game

you use arrow keys to switch traffic lights and try not to cause a mess

free to play, obv 🙂

👉 https://tuesdae.games 🚦

would love to hear what you think

it's also now open source
just felt right to make it public
feel free to explore, learn, or build your own version for fun

https://github.com/rudi-q/tuesdae-rush

Introducing Cristalyse: Grammar of Graphics Charts for Flutter

Rudi K. 🧠 — Sat, 05 Jul 2025 19:50:12 +0000

If you've ever tried to build decent data visualizations in Flutter, you know the pain. You either get stuck with basic chart widgets that look like they're from 2010, or you end up embedding web views just to use D3.js. Neither feels great.

As someone who has a CS degree focused on data analytics, I spent way too much time fighting with fl_chart and charts_flutter. They're fine for simple stuff, but the moment you need anything remotely sophisticated, you're out of luck.

Don't get me wrong - those libraries serve their purpose. But when you need dual y-axes, custom interactions, or anything beyond basic bar/line charts, you're basically SOL.

So I built Cristalyse.

What's different about it?

It's based on grammar of graphics (think ggplot2 if you've used R). Instead of rigid chart widgets, you build visualizations by layering data, mappings, and geometries.

Here's what a scatter plot looks like:

CristalyseChart()
  .data([
    {'x': 1, 'y': 2, 'category': 'A'},
    {'x': 2, 'y': 4, 'category': 'B'},
    {'x': 3, 'y': 1, 'category': 'A'},
  ])
  .mapping(x: 'x', y: 'y', color: 'category')
  .geomPoint(size: 5.0, alpha: 0.7)
  .scaleXContinuous()
  .scaleYContinuous()
  .theme(ChartTheme.defaultTheme())
  .build()

Compare that to the usual Flutter chart setup where you're passing in a dozen different widget properties and hoping for the best.

Actually useful features

The stuff I was missing in other libraries:

Dual Y-axis support - Because sometimes you need to plot revenue and user count on the same chart without everything looking broken. Most Flutter chart libraries either don't support this or make it incredibly painful.

Proper animations - 60fps smooth transitions that leverage Flutter's rendering engine. Not the janky CSS-style animations you get with web-based solutions.

Real theming - Change colors, fonts, spacing, grid styles, whatever. No more "this chart library only supports 5 preset themes" nonsense.

SVG export - For when your PM asks for "just a quick chart for the presentation" (we've all been there). Works across all platforms.

Interactive tooltips - Hover states that actually work and look professional. Pan and zoom that feels natural.

Multiple geometries - Layer different chart types on the same plot. Scatter plots with trend lines, bar charts with reference lines, whatever makes sense for your data.

Real world example

Here's something I built recently - a dashboard showing user engagement over time with conversion events overlaid:

CristalyseChart()
  .data(analyticsData)
  .mapping(x: 'date', y: 'activeUsers')
  .mappingY2('conversions')
  .geomLine(
    yAxis: YAxis.primary,
    strokeWidth: 2.0,
    color: Colors.blue,
  )
  .geomPoint(
    yAxis: YAxis.secondary,
    color: Colors.red,
    size: 8.0,
  )
  .scaleXContinuous()
  .scaleYContinuous(min: 0)
  .scaleY2Continuous(min: 0)
  .theme(ChartTheme.defaultTheme())
  .build()

Try doing that cleanly with fl_chart. I'll wait.

Performance that doesn't suck

I benchmarked this against the popular Flutter chart libraries with a dataset of 10k points. Cristalyse consistently outperformed them, especially on animations and interactions. The secret sauce is leveraging Flutter's CustomPainter directly instead of building complex widget trees.

Plus, since it's not web-based, you don't get the typical "works great in Chrome, terrible everywhere else" experience.

Cross-platform without the headaches

The best part? It works everywhere Flutter works. Mobile, web, desktop, all from the same code. No platform-specific chart libraries, no "oh this doesn't work on web" surprises.

I've been using it for dashboards in my own projects and it's been solid. The performance is actually better than the web-based solutions because it's using Flutter's rendering engine instead of fighting with DOM manipulation.

Why grammar of graphics matters

If you've never used ggplot2 or similar libraries, the grammar of graphics approach might seem weird at first. But it's incredibly powerful once it clicks.

Instead of having separate widgets for LineChart, BarChart, ScatterPlot, etc., you have one Chart widget that you compose different layers onto. Want a scatter plot with a trend line? Add both geomPoint() and geomSmooth(). Want to color code by category? Map a column to the color aesthetic.

This composability means you can create complex visualizations that would be impossible (or really ugly) with traditional chart widgets.

The technical stuff

Under the hood, Cristalyse uses Flutter's CustomPainter for rendering, which gives us direct access to the canvas. This means:

Better performance than widget-heavy approaches
Smooth animations using Flutter's animation framework
Consistent rendering across all platforms
Easy integration with Flutter's existing theming system

The data processing pipeline handles missing values gracefully, supports different data types (numeric, categorical, datetime), and includes basic statistical transformations out of the box.

Try it out

It's on pub.dev as cristalyse. Check out cristalyse.com for examples and getting started info, or jump straight to the full documentation at docs.cristalyse.com with interactive examples and a proper quickstart guide.

The docs site has live code examples you can copy-paste, plus a gallery of different chart types with complete source code.

Fair warning: it's still early days (version 0.9.3), so expect some rough edges. But it's functional enough that I'm using it in production for client projects.

What's next

Working on a few things for the next release:

Histogram and density plots
Better mobile touch interactions
More statistical transformations (smoothing, regression lines)
Faceting support for small multiples
Better integration with common Flutter state management patterns

If you've been frustrated with Flutter's chart situation, give it a shot. The GitHub repo is open for issues, feature requests, or if you want to contribute.

Built this because I needed it, figured others might too. Source is on GitHub if you want to poke around or contribute.