MosaicFlow Svelte Themes

Mosaicflow

⚠️ Archived — superseded by MosaicFlow-Svelte. Original React version of the node-based canvas app.

MosaicFlow

A powerful, infinite canvas for visual thinking, research, and knowledge mapping. Perfect for OSINT investigations, academic research, project planning, or organizing complex information — built with Tauri v2 and React.

Features

  • Infinite Canvas: Zoom and pan freely to organize your ideas and research.
  • Rich Node Types: 18+ specialized node types for diverse workflows.
  • Real-time Saving: Automatically saves your work to a local workspace folder.
  • Curved Connections: Connect nodes with smooth, curved edges.
  • Export Options: Export your canvas to PNG, SVG, or ZIP for sharing.
  • Interaction Modes: Switch between select, pan, and move modes.
  • Dark Mode: Optimized for extended work sessions.
  • Fast & Lightweight: Built on Rust and React.

Node Types

Basic Nodes

  • Note: Markdown-enabled text notes with live preview
  • Image: Display and annotate images from your investigation
  • Link: Store and preview URLs with metadata
  • Group: Organize related nodes together

OSINT & Research Nodes

  • Person: Track individuals with aliases, contact info, and social media profiles
  • Organization: Document companies, government entities, NGOs, and groups
  • Map Location: Geographic coordinates with OpenStreetMap/Google Maps integration
  • Domain: Track domains with WHOIS, DNS, and SSL information
  • Social Post: Archive social media posts with engagement metrics

Technical Nodes

  • Router/Device: Network infrastructure with IP, MAC, ports, and ISP info
  • Hash/IOC: File hashes with VirusTotal and MalwareBazaar lookups
  • Credential: Track leaked credentials with HIBP integration
  • Code Snippet: Store code, API responses, and commands with syntax highlighting

Evidence Nodes

  • Timestamp: Date/time tracking with timezone support and multiple formats
  • Snapshot: Screenshot evidence with source URL and capture timestamp
  • Link List: Group related URLs (e.g., all social profiles for a target)
  • Action: Execute external apps, open folders, or run commands

Getting Started

  1. Install dependencies:

    pnpm install
    
  2. Run the development server:

    pnpm tauri dev
    
  3. Build for production:

    pnpm tauri build
    

Usage

  • Create Workspace: On first launch, create or open a workspace folder
  • Add Node: Click the "+" button in the toolbar or use keyboard shortcuts
  • Edit Node: Click on any node to edit its properties
  • Connect Nodes: Drag from one handle (dot) to another
  • Save: Press Ctrl+S or click the save icon
  • Delete Node: Select and press Delete or use the trash icon
  • Resize Node: Select a node and drag the corner handles

Keyboard Shortcuts

Key Action
N Add Note node
I Add Image node
L Add Link node
G Add Group node
M Add Map node
T Add Timestamp node
Ctrl+S Save workspace
Ctrl+D Duplicate selected
Delete Delete selected
F Fit view
+ Zoom in
- Zoom out

Workspace Structure

When you create a workspace, MosaicFlow creates a folder structure:

my-investigation/
├── workspace.json    # Main canvas data
├── images/           # Stored images
├── notes/            # Markdown note content
└── properties/       # Node property files

Tech Stack

  • Frontend: React 19, Tailwind CSS, React Flow (@xyflow/react)
  • Backend: Tauri v2 (Rust)
  • Storage: Local File System with folder-based workspace
  • Icons: Lucide React

License

MIT

Top categories

Loading Svelte Themes