Iced Code Editor
A high-performance, canvas-based code editor widget for Iced.
Overview
This crate provides a fully-featured code editor widget with syntax highlighting, line numbers, text selection, and comprehensive keyboard navigation for the Iced GUI framework.

Features
- Syntax highlighting for multiple programming languages via syntect
- Line numbers with styled gutter
- Text selection via mouse drag and keyboard shortcuts
- Clipboard operations (copy, paste)
- Undo/Redo with smart command grouping and configurable history
- Custom scrollbars with themed styling
- Focus management for multiple editors
- Dark & light themes with customizable colors
- High performance canvas-based rendering
Quick Start
Add this to your Cargo.toml:
[]
= "0.14"
= "0.2"
Basic Example
Here's a minimal example to integrate the code editor into your Iced application:
use container;
use ;
use ;
Keyboard Shortcuts
The editor supports a comprehensive set of keyboard shortcuts:
Navigation
| Shortcut | Action |
|---|---|
| Arrow Keys (Up, Down, Left, Right) | Move cursor |
| Shift + Arrows | Move cursor with selection |
| Home / End | Jump to start/end of line |
| Shift + Home / Shift + End | Select to start/end of line |
| Ctrl + Home / Ctrl + End | Jump to start/end of document |
| Page Up / Page Down | Scroll one page up/down |
Editing
| Shortcut | Action |
|---|---|
| Backspace | Delete character before cursor (or delete selection if text is selected) |
| Delete | Delete character after cursor (or delete selection if text is selected) |
| Shift + Delete | Delete selected text (same as Delete when selection exists) |
| Enter | Insert new line |
Clipboard
| Shortcut | Action |
|---|---|
| Ctrl + C or Ctrl + Insert | Copy selected text |
| Ctrl + V or Shift + Insert | Paste from clipboard |
Undo/Redo
| Shortcut | Action |
|---|---|
| Ctrl + Z | Undo last operation |
| Ctrl + Y | Redo last undone operation |
The editor features smart command grouping - consecutive typing is grouped into single undo operations, while navigation or deletion actions create separate undo points.
Usage Examples
Changing Themes
use theme;
// Apply dark theme
editor.set_theme;
// Apply light theme
editor.set_theme;
Getting and Setting Content
// Get current content
let content = editor.content;
// Check if content has been modified
if editor.is_modified
// Mark content as saved (e.g., after saving to file)
editor.mark_saved;
Cursor Blinking
For cursor blinking animation, subscribe to window frames:
use ;
// In your update function
Tick =>
Themes
The editor supports both dark and light themes with customizable colors. Each theme includes:
- Background and foreground colors
- Gutter (line numbers) styling
- Selection colors
- Cursor appearance
- Scrollbar styling
Themes automatically adapt to syntax highlighting for optimal readability.
Supported Languages
The editor supports syntax highlighting for numerous languages via the syntect crate:
- Rust (
"rs"or"rust") - Python (
"py"or"python") - JavaScript/TypeScript (
"js","javascript","ts","typescript") - Lua (
"lua") - C/C++ (
"c","cpp","c++") - Java (
"java") - Go (
"go") - HTML/CSS (
"html","css") - Markdown (
"md","markdown") - And many more...
For a complete list, refer to the syntect documentation.
Demo Application
A full-featured demo application is included in the demo-app directory, showcasing:
- File operations (open, save, save as)
- Theme switching
- Modified state tracking
- Clipboard operations
- Full keyboard navigation
Run it with:
Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
License
This project is licensed under the MIT License - see the LICENSE file for details.