CueMode - Professional Developer Teleprompter
中文文档 | GitHub Pages
Transform VS Code into a professional teleprompter. Perfect for coding livestreams, technical presentations, educational videos, and professional content creation. Features instant theme switching, enhanced focus mode, auto-scroll control, and distraction-free reading experience.
🎯 What is CueMode?
CueMode is a next-generation teleprompter extension that transforms your VS Code editor into a professional teleprompter solution. Now featuring automatic UI management, instant theme cycling, enhanced focus mode, expanded internationalization, and professional-grade functionality designed for developers, educators, and content creators.
✨ Version 2.7 Features:
- 🎯 Double-Click to Edit - NEW! Click any text to jump to exact position in source for editing, with auto-selection and position memory
- 🎯 Automatic UI Management - Distraction-free presentations with auto-hide sidebar/panel and smart restoration
- 🔤 Font Size Control - Dynamic font adjustment with keyboard shortcuts (Ctrl+Shift+=/−, [ / ] keys)
- 📐 Differentiated Header Sizes - Professional visual hierarchy for H1-H6 headers with responsive design
- 💬 HTML Comment Visibility - Display markdown comments for speaker notes and presentation cues
- 📝 Selective Markdown Parsing - Intelligent markdown formatting for presentations with D-key toggle
- 📏 Line Height Adjustment - Professional line spacing control with L-key cycling (1.0, 1.2, 1.5, 1.8, 2.0)
- 🪞 M-Key Mirror Flip - Professional horizontal text mirroring for teleprompter hardware setups
- 📍 Smart Status Indicators - Visual feedback system with intelligent positioning to avoid UI conflicts
- 🎨 T-Key Theme Cycling - Instant theme switching across all 7 professional themes during presentations
- 🔍 Enhanced F-Key Focus Mode - Smart gradient blur algorithm with configurable focus lines (1-10) and opacity (0.1-0.8) for superior concentration
- ⚡ Enhanced Commands - Quick theme changes and text preprocessing
- 📱 Smart Notifications - Non-intrusive status bar feedback
- 🌐 Expanded Internationalization - Support for 6 languages: English, Chinese, German, French, Japanese, Korean
- 🛠️ TypeScript Architecture - Robust, maintainable codebase
- 🧪 Comprehensive Testing - 153 test cases ensuring reliability
Core Teleprompter Features:
- Auto-scrolling text - Smooth, controllable scroll speed for natural reading
- Large font display - Optimized for distance reading and camera work
- High contrast display - Clear visibility in any lighting condition
- Invisible controls - Minimal UI interference during recording/presentation
- Keyboard shortcuts - Professional teleprompter controls (start/stop, speed adjustment)
Simply select your script text or open your presentation notes, activate "Teleprompter Mode" from the command palette, and start presenting with confidence.
✨ Professional Teleprompter Features
CueMode provides professional teleprompter functionality for modern content creators:
📺 Professional Teleprompter Controls
- Auto-scroll functionality - Smooth, customizable scrolling speed
- Spacebar control - One-key start/stop scrolling
- Speed adjustment - Real-time speed control with +/- keys
- Direction switching - Reverse scrolling with R key
- Manual navigation - Precise positioning with arrow keys
- 🆕 T-Key theme cycling - Instant theme changes during presentations
- 🪞 Mirror flip mode - Horizontal text mirroring for professional teleprompter setups
🎨 Optimized Display
- Large fonts - Perfect for distance reading
- Centered layout - Natural eye movement for camera work
- High contrast themes - Clear visibility in any lighting condition
- Minimal interface - Hidden controls that don't interfere with recording
🎭 Professional Themes
- Classic - Traditional teleprompter black background with white text
- Inverted - White background with black text for bright environments
- Midnight Blue - Professional studio appearance
- Sunset - Warm, comfortable reading experience
- Forest - Eye-friendly for extended use
- Ocean - Calming blue for relaxed presentations
- Rose - Elegant theme for sophisticated content
⚙️ Teleprompter Settings
- Scroll speed - Fine-tune reading pace (0.1-5.0 range)
- Font size - Optimize for reading distance (12-72pt)
- Line height - Control text spacing comfort (1.0-3.0em)
- Content width - Set optimal reading width (400-1200px)
- Starting position - Position text for comfortable reading
- Padding - Adjust margins according to setup
- Focus mode - Enhanced concentration with gradient blur (NEW!)
- 🪞 Mirror flip - Horizontal text mirroring for professional teleprompter hardware setups
🚀 Perfect Teleprompter Use Cases
- YouTube Videos - Natural script reading while maintaining eye contact
- Live Streaming - Smooth delivery for coding tutorials and tech talks
- Video Tutorials - Professional presentation of prepared content
- Online Courses - Confident delivery of educational content
- Webinars - Professional speaking with script support
- Product Demos - Consistent messaging with teleprompter assistance
- Screen Recording - Professional video content
- Code Reviews - Focus on important details
- Presentations - Showcase your work
- Focused Development - Reduce distractions
🚀 Quick Start - Teleprompter Setup
Installation
- Open VS Code
- Go to Extensions (Ctrl+Shift+X / Cmd+Shift+X)
- Search for "CueMode" or "teleprompter"
- Click Install
Or install directly from VS Code Marketplace:
CueMode - Professional Teleprompter
Basic Teleprompter Usage
- Prepare script - Create or open a text file with your presentation content
- Select script text (optional - if none selected, entire file will be used)
- Activate teleprompter - Use Ctrl+Shift+P (Cmd+Shift+P on Mac) and search for "Teleprompter Mode"
- Start reading - Press spacebar to begin auto-scrolling
- Control during presentation:
- Double-Click: NEW! Click any text to jump to that exact position in source for editing
- Spacebar: Start/pause auto-scrolling
- T Key: Enhanced! Instant theme switching across all 7 themes
- F Key: New! Toggle enhanced focus mode with gradient blur
- D Key: Toggle selective markdown parsing for formatted content
- M Key: Toggle mirror flip mode
- [ / ]: NEW! Decrease/Increase font size dynamically
- +/-: Real-time reading speed adjustment
- R Key: Reverse scrolling direction
- Arrow keys: Manual navigation
Professional Teleprompter Shortcuts
🎯 Main Controls:
- Spacebar - Start/pause auto-scrolling (primary control)
- T Key - Instant theme cycling through all 7 professional themes
- F Key - Toggle enhanced focus mode with smart gradient blur
- D Key - Toggle selective markdown parsing for formatted presentations
- M Key - Toggle mirror flip mode for teleprompter hardware
- [ / ] - NEW! Decrease/Increase font size (8-100pt range)
- +/- - Increase/decrease scrolling speed in real-time
- R Key - Toggle scrolling direction (up/down)
📱 Navigation:
- Arrow keys - Manual navigation
- Page Up/Down - Quick manual scrolling
- Home/End - Jump to start/end
⚙️ Advanced Controls:
- Ctrl+Shift+T (Cmd+Shift+T on Mac) - Open theme selection menu
- Ctrl+Shift+R (Cmd+Shift+R on Mac) - Remove leading spaces from text
- Ctrl+Shift+M (Cmd+Shift+M on Mac) - Toggle mirror flip mode
- Ctrl+Shift+D (Cmd+Shift+D on Mac) - Toggle selective markdown parsing mode
- Ctrl+Shift+= (Cmd+Shift+= on Mac) - NEW! Increase font size
- Ctrl+Shift+− (Cmd+Shift+− on Mac) - NEW! Decrease font size
- H Key - Show/hide help panel
- Esc Key - Exit teleprompter mode
📝 Selective Markdown Parsing NEW!
CueMode now features intelligent markdown parsing that enhances your presentation content while maintaining optimal teleprompter readability.
🎯 What is Selective Markdown Parsing?
Selective markdown parsing transforms your markdown content into beautifully formatted, teleprompter-optimized text while preserving the natural flow needed for smooth reading during presentations.
Key Benefits:
- Enhanced readability - Clean, formatted content without distracting syntax
- Professional appearance - Tables, lists, and headers properly styled
- Maintained flow - Optimized for natural reading rhythm
- Instant toggling - Switch between raw and parsed modes seamlessly
🚀 How to Use Markdown Mode
- Prepare markdown content - Create or open a
.md file with your presentation content
- Activate teleprompter - Use Ctrl+Shift+P and search for "Teleprompter Mode"
- Toggle markdown parsing - Press D key in webview OR use Ctrl+Shift+D command
- Present with confidence - Enjoy clean, formatted content optimized for reading
⌨️ Markdown Mode Controls
🎯 Toggle Markdown Parsing:
- D Key (in webview) - Instant toggle between raw and parsed markdown
- Ctrl+Shift+D (Cmd+Shift+D on Mac) - Toggle from VS Code or webview
📱 Visual Feedback:
- Status indicator - Shows current parsing mode (Raw/Parsed)
- Smart positioning - Status avoids conflicts with other UI elements
- Theme integration - Status styling matches your selected theme
🎨 Supported Markdown Elements
📝 Text Formatting:
- Headers (H1-H6) - Properly sized and styled for hierarchy
- Bold/Italic - Emphasized text maintains readability
- Code spans - Inline code with syntax highlighting
- Links - Clean link presentation for references
📋 Structured Content:
- Tables - Professional table layouts with proper spacing
- Lists - Bulleted and numbered lists with clean formatting
- Task lists - Interactive checkboxes for presentation checklists
- Blockquotes - Styled quotes for emphasis
💻 Code Content:
- Code blocks - Syntax-highlighted code with proper spacing
- Language support - Automatic detection and highlighting
- Preserved formatting - Maintains indentation and structure
🎯 Teleprompter-Optimized:
- Smart spacing - Optimal line heights for comfortable reading
- Theme integration - All 7 themes support markdown styling
- Performance optimized - < 50ms parsing for smooth experience
- Focus mode compatible - Works seamlessly with enhanced focus mode
📊 Markdown Configuration
Default Settings:
- Markdown parsing: Disabled by default (preserves existing workflow)
- Easy activation: Toggle with D key or Ctrl+Shift+D
- Persistent mode: Setting saved across sessions
- Performance: Optimized parsing with < 50ms processing time
Customization:
- Theme integration - Markdown styles adapt to your selected theme
- Font scaling - Markdown elements scale with your teleprompter font size
- Focus compatibility - Works with all focus mode settings
🎬 Perfect for Presentations
📺 Content Types:
- Technical presentations - Code examples with syntax highlighting
- Documentation reviews - Formatted docs for clear presentation
- Tutorial scripts - Step-by-step guides with proper formatting
- Meeting notes - Structured content for professional meetings
- Educational content - Well-formatted educational materials
🚀 Professional Benefits:
- Consistent formatting - Professional appearance across all content
- Reduced preparation time - Use existing markdown files directly
- Enhanced credibility - Clean, well-formatted content for better delivery
- Flexible workflow - Toggle between raw and formatted views instantly
⚙️ Teleprompter Configuration
Accessing Settings
- Open VS Code settings (Ctrl+, / Cmd+,)
- Search for "cuemode"
- Adjust teleprompter settings as needed
Key Settings
- Color Theme - Choose from 7 professional themes
- Font Size - Adjust for reading distance (recommended 24-48pt)
- Scroll Speed - Set comfortable reading pace (recommended 0.1-0.3)
- Max Width - Control text line length (recommended 800-1200px)
- Starting Position - Position content on screen (recommended 30-50%)
- Focus Mode - Enable enhanced concentration mode (NEW!)
- Focus Opacity - Adjust blur intensity (0.1-0.8, default 0.3)
- Focus Line Count - Set focus area size (1-10 lines, default 3)
- Markdown Parsing - NEW! Enable selective markdown formatting (default: disabled)
🎯 Professional Usage Tips
📺 Video Recording Setup
- Choose high-contrast themes (Classic or Inverted) for best readability
- Increase font size (32-48pt) for distance reading
- Adjust scroll speed to match your natural speaking pace
- Use T key for seamless theme switching during recording
- Enable focus mode with F key for enhanced concentration on current content
🎤 Live Streaming Tips
- Practice shortcuts, especially spacebar, T key, and F key for focus mode
- Prepare content by removing leading spaces for clean display
- Use H key for quick help access (if you forget shortcuts)
- Test themes and focus mode under your lighting setup for best visibility
- Customize focus settings to match your reading preferences
📚 Educational Content
- Break complex code into manageable chunks
- Use slower scroll speeds for detailed explanations
- Leverage manual navigation (arrow keys) to highlight specific sections
- Prepare backup themes for different content types
- Use focus mode to highlight key concepts during explanations
🆕 New Features Explained
🔍 Enhanced F-Key Focus Mode
In teleprompter mode, simply press F key to toggle enhanced focus mode on/off:
- Smart Gradient Blur: Advanced algorithm provides smooth reading experience with buffer zones
- Configurable Focus Area: Adjust focus lines (1-10 lines, default 3)
- Adjustable Opacity: Set blur opacity (0.1-0.8, default 0.3)
- Visual Focus Indicator: Beautiful styling shows current active reading area
- Real-time Updates: Settings take effect immediately without restart
🎨 T-Key Theme Cycling
In teleprompter mode, simply press T key to cycle through all themes:
- Classic → Inverted → Midnight Blue → Sunset → Forest → Ocean → Rose → Classic...
- Status bar shows current theme name
- Settings auto-save
⚡ Enhanced Commands
- Ctrl+Shift+T: Open theme selection menu (with preview)
- Ctrl+Shift+R: Smart removal of leading spaces and indentation
- Ctrl+Shift+M: Toggle mirror flip mode for teleprompter hardware
📱 Smart Notifications
- All notifications now appear in status bar
- Auto-disappear after 2-3 seconds
- Won't interrupt your workflow
🌐 Expanded Internationalization
- Support for 6 languages: English, Chinese, German, French, Japanese, Korean
- Professional teleprompter terminology localization
- Automatic language detection from VS Code environment
🤝 Contributing
We welcome contributions! Please see our Contributing Guide for details.
For development setup, refer to DEVELOPMENT.md.
📝 License
This project is licensed under the MIT License.
🤝 Contributing
We warmly welcome your contributions! Whether reporting bugs, suggesting new features, improving documentation, or submitting code, all contributions are valuable support for the project.
For detailed information, please check:
🔗 Links
🌟 Support the Project
If CueMode has helped your content creation, please consider:
- ⭐ Starring us on GitHub
- 📝 Leaving a review on VS Code Marketplace
- 🐛 Reporting issues or suggesting features
- 🤝 Contributing code or documentation
Make your presentations more professional, make your content shine! 🎬✨
