Blocks

Blocks are the fundamental units of content in Ideon. Every item on the canvas is a block.

Core Concepts

• Position: Every block has x, y coordinates.
• Dimensions: Most blocks can be resized.
• Connections: Blocks can be connected to visualize relationships. Links can also have text labels.
• Selection: Blocks can be grouped and moved together.

Block Types

0. Core Block

The root block of every project. It is automatically created when a project is initialized.

• Features: Displays the project title and description.
• Use Case: Serves as the central anchor or "home" for the project canvas.

1. Note Block

A simple text note supporting Markdown.

• Features: Rich text, lists, tables, code blocks, and Markdown images.
• Image sources: HTTPS URLs and same-origin paths; external images load without referrer information.
• Shortcuts: Ctrl+B (Bold), Ctrl+I (Italic), Ctrl+U (Underline), Ctrl+K (Link), Ctrl+Z (Undo), Ctrl+Y (Redo).
• Use Case: Quick thoughts, sticky notes, labels.

Comparison matrix

Option	Best fit	Trade-off
Notes	Flexible research	Free-form structure
Kanban	Ongoing workflows	More setup
Calendar	Dated milestones	Time-focused

2. Snippet Block

A code editor with syntax highlighting.

• Features: Supports several languages, copy-to-clipboard.
• Use Case: Storing algorithms, config files, or queries.

3. Link Block

A bookmark to an external resource.

• Features: Automatically fetches and displays a rich preview card with the page title, description, and image.
• Use Case: linking to documentation, inspiration, or external tools.

4. Contact Block

Represents a person or a role.

• Features: Name, role, contact info.
• Use Case: Mapping stakeholders, team members, or user personas.

5. Checklist Block

A task list with checkboxes.

• Features:
  • Add/remove items, check/uncheck.
  • Drag-and-drop: Reorder tasks or move them between different checklist blocks.
  • Indentation: Use Tab to indent (nest) tasks and Shift+Tab to outdent.
• Use Case: Todo lists, requirements, acceptance criteria.

6. Palette Block

A color palette generator and storage.

• Features: Generate palettes, store hex codes.
• Use Case: Design systems, branding.

7. Video Block

Embeds a video player.

• Features: Supports YouTube/Vimeo links.
• Use Case: Tutorials, demos, references.

8. GitHub & Git Block

A powerful integration to display repository metadata and live statistics from various Git providers.

• Multi-Provider Support: Compatible with GitHub, GitLab, Gitea, and Forgejo.
• Live Stats: Displays stars, latest release, last commit date, open issues, and contributors.
• Private & Self-Hosted Repositories:
  • To access private repositories or self-hosted instances (e.g., a private GitLab server), you must configure a Git Token in your User Settings.
  • Ideon uses the token to authenticate and identify the provider type.
• Use Case: Tracking dependencies, project repositories, or monitoring health across different forges.

9. File Block

Allows uploading or linking to files.

• Features:
  • Multimedia Support: Native playback for audio (.mp3) and video (.mp4) files directly within the canvas.
• Use Case: Attaching design assets, demo recordings, PDFs, or other documents.

10. Sketch Block

A powerful whiteboard tool for diagrams, wireframes, and freehand sketches, powered by a full Excalidraw integration.

• Features:
  • Full Excalidraw Toolset: Use all standard Excalidraw features (shapes, arrows, layers, and library).
  • Import Sketches: Drag and drop any .excalidraw file onto the canvas to instantly create a new Sketch block with its content.
• Use Case: Brainstorming, architectural diagrams, wireframing, or visual annotations.

11. Calendar Block

A lightweight event planner directly on the canvas for tracking meetings, deadlines, and milestones without leaving Ideon.

• Features:
  • Event modal: Create and edit events with title, description, color, all-day toggle, start/end dates, and completion status.
  • Multi-day support: Display events that span multiple days, with a clean weekly timeline view.
  • Quick interaction: Click a day to add events, click an event to edit it, and right-click to duplicate or delete.
  • Visual cues: Event colors and completed states make agenda items easy to scan at a glance.
  • .ics import: Drag an .ics file onto a Calendar block or use the import button to add events directly from a calendar export.
• Use Case: Planning releases, sprint previews, editorial calendars, or coordinating team schedules alongside project work.

12. Shell Block

A fully interactive terminal embedded in the canvas, powered by xterm.js and node-pty.

• Environment: Runs commands directly on the hosted instance (the server running Ideon).
• Note: SSH connections are not yet supported.
• Features:
  • Start/Stop/Kill: Manage the lifecycle of the shell session.
    • Stop: Pauses the session while preserving the scrollback buffer for instant resume.
    • Kill: Destroys the session entirely.
  • Zero RAM: Consumes no memory when stopped.
• Access Control: Restricted to project creators and owners.
• Use Case: Running scripts, checking logs, or managing infrastructure directly from the canvas.
• Disable: Set SHELL_MAX_SESSIONS=0 in your environment variables to completely disable this feature.

13. Kanban Block

A visual task management board with customizable columns, custom fields, team assignees, and Markdown descriptions for comprehensive workflow organization.

• Board Management:

  • Columns: Create, rename, delete, reorder, and resize columns to match workflow stages. Each column supports descriptions and custom colors for visual organization.
  • Board Settings: Configure visible fields, set default values, and organize your board layout from a centralized settings panel.

• Task Management:

  • Task Creation: Add tasks directly within columns with titles and detailed descriptions.
  • Descriptions: Write task descriptions using Markdown, supporting code blocks, tables, links, and formatted text for rich task documentation.
  • Completion Status: Toggle task completion status with a checkbox; completed tasks remain visible on the board.
  • Task Attributes: Edit task text, descriptions, assign collaborators, and fill custom fields directly from the task modal.

• Custom Fields: Organize tasks with your own fields beyond task titles. Supports four field types:

  • Text: Simple text input for notes, URLs, or any text data.
  • Date: Date picker for deadlines, start dates, or milestones.
  • Single Select: Dropdown with custom options and color coding for categorization (e.g., Priority, Component, Type).
  • Number: Numeric values for story points, complexity estimates, or other metrics.
  • Each field can be made visible/hidden per view, have default values, and be reordered in the board settings.

• Team Collaboration:

  • Multi-Assignee Support: Assign multiple collaborators to a single task, showing avatar stacks on cards for easy identification.
  • Role-Based Permissions: Team members can edit assigned tasks based on their project role (Creator/Owner = full edit, Editor = modify tasks, Viewer = read-only).

• Drag-and-Drop Interactions:

  • Within Board: Reorder tasks within columns, move tasks between columns.
  • Cross-Board: Transfer tasks between different Kanban blocks in the same project.
  • Cross-Block: Drag checklist items from Checklist blocks directly into Kanban columns.
  • Column Drag: Move entire columns between Kanban boards.
  • Visual Feedback: Preview highlights during drag operations show placement targets.

• Use Case: Sprint planning, agile workflow tracking, project stage management, feature prioritization, team task coordination, and complex project workflows.

14. Folder Block

A structural block used to organize and scope your canvas content.

• Features:
  • Organization: Group related blocks by connecting them to a Folder block.
  • Collapse/Expand: Click the collapse icon to hide all descendant blocks, keeping your canvas clean.
  • Import: Dragging a physical folder from your computer onto the canvas creates a Folder block containing all its compatible files.
• Use Case: Scoping features, managing complex project hierarchies, or creating specific work areas.

15. Vercel Block

Monitor and manage your Vercel deployments directly from your workspace.

• Features:
  • Live Monitoring: Track deployment status, production URLs, and project activity.
  • Deployment Actions: Trigger redeploys and manage environment variables (requires appropriate permissions).
  • Integration: Securely connects via OAuth or Personal Access Tokens (PAT).
• Use Case: Dev-ops monitoring, quick access to project previews, and deployment lifecycle management.

16. LaTeX Block

A block for writing and displaying mathematical notation using LaTeX syntax.

• Features:
  • Edit / Preview toggle: Write raw LaTeX in edit mode, switch to preview to see it rendered. Use Ctrl+P to toggle.
  • Inline math: Wrap expressions in $...$ for inline rendering.
  • Display math: Wrap expressions in $$...$$ for centered, block-level equations.
  • Vim mode: Supported when Vim mode is enabled in Account settings.
• Use Case: Documenting algorithms, mathematical proofs, formulas, or any content that benefits from proper mathematical notation.

17. Mermaid Block

A collaborative diagram block that renders Mermaid source directly on the canvas.

• Source editing: Edit the original Mermaid text without leaving the canvas.
• Diagram preview: Render flowcharts, sequence diagrams, and supported C4 diagrams.
• Invalid source: Keep the source visible alongside the parser error.
• PNG export: Download the rendered diagram as an image.
• Use Case: Mapping architecture, workflows, and system interactions.

18. Webhook Block

A live HTTP endpoint on the canvas. Drop one on the canvas to get a URL that any service can POST to. Configure conditions and actions to react to incoming events server-side, without requiring an open browser tab.

See the Automation guide for full configuration details.

19. Cron Block

Executes a canvas action on a configurable schedule. Uses the same action set as the Webhook block, driven by time instead of an event.

See the Automation guide for full configuration details.

20. Sub-Canvas Block

A nested canvas embedded within the main canvas. Sub-canvases let you zoom into complex areas without visual clutter by isolating a group of blocks into their own space.

Drop a Sub-Canvas on the canvas, then double-click it to drill in. You can navigate back with the breadcrumb trail or the dedicated back button.

• Breadcrumb navigation: A breadcrumb trail shows your current depth and lets you jump back to any parent canvas.
• Use Case: Breaking down large architecture diagrams, isolating workflow details, organizing complex projects.

21. Frame Block

A visual container that groups related blocks with an optional colored border.

• Color: Choose any color for the frame border to visually categorize groups (e.g. red for "blocked", green for "done").
• Layering: Frames render behind other blocks, serving as a background layer.
• Use Case: Visual grouping, focus areas, or decorative boundaries around related content.

Interacting with Blocks

Ideon provides intuitive ways to interact with blocks on the canvas:

• Drag & Drop: Click and hold any block to move it around the infinite canvas.
• Import via Drop: Drag files or folders from your local machine directly onto the canvas to import them instantly:
  • .md files are imported as Note blocks.
  • .excalidraw files are imported as Sketch blocks.
  • Folders are imported as Folder blocks, preserving their hierarchy.
  • All other supported files are imported as File blocks.
• Resize: Drag the corners or any edge of a block to adjust its size. Edge handles resize in a single axis only. Snaps to neighboring block edges with the same alignment guides as dragging — hold Shift to disable snapping.
• Connect: Drag a line from one block's handle (the small dots on the sides) to another block to create a relationship.
  • Labels: Double-click on a connection line to add a text label (e.g., "depends on", "blocked by").
• Edit: Double-click the body of a block to edit its content (text, code, checklists, etc.).
• Vim Mode: Enable Vim keybindings for Note and Snippet blocks via the toggle in your Account Page.
• React: Hover over a block and click the emoji icon to add a reaction. This is great for asynchronous voting or acknowledging updates without cluttering the canvas.
• Context Menu: Right-click a block to access advanced options like Locking, Duplicate, Delete, or Bring to Front/Send to Back.
• Multi-Select: Hold Shift and click multiple blocks, or drag a selection box around them to move or delete them as a group.