Keyboard Shortcuts

Navigate MarkView efficiently with keyboard shortcuts for search, themes, and navigation

MarkView provides powerful keyboard shortcuts to help you work efficiently without reaching for the mouse. All shortcuts work globally within the application.

Quick Reference

File Search

Ctrl+K or Cmd+K

Open the file search modal to quickly find and switch between files

Theme Switcher

Alt+T

Open the theme selector to change the app’s appearance

Close Modal

Esc

Close any open modal (theme selector or file search)

Navigate Results

↑ / ↓

Navigate up and down through search results or theme options

Detailed Shortcuts

File Management

Open File Search (Ctrl+K / Cmd+K)

Opens the command palette-style file search modal.

Implementation: page.tsx:382-388

if ((e.ctrlKey || e.metaKey) && e.key === 'k') {
  e.preventDefault();
  setShowFileSearchModal(true);
  setSearchQuery('');
  setFileSearchIndex(0);
  setTimeout(() => fileSearchInputRef.current?.focus(), 50);
}

What happens:

• Opens the file search modal
• Clears any previous search query
• Resets the selection to the first item
• Automatically focuses the search input

Usage:

1. Press Ctrl+K (Windows/Linux) or Cmd+K (Mac)
2. Start typing to filter files
3. Use arrow keys to navigate
4. Press Enter to open the selected file

Navigate File List (↑ / ↓)

When the file search modal is open, use arrow keys to move through results.

Implementation: page.tsx:412-424

• ↓ Arrow Down: Move to the next file in the list (wraps around to first)
• ↑ Arrow Up: Move to the previous file (wraps around to last)

The selection wraps around using modulo arithmetic for seamless navigation.

Open Selected File (Enter)

When a file is highlighted in the search modal, press Enter to open it.

Implementation: page.tsx:420-424

if (e.key === 'Enter' && filteredFilesModal.length > 0) {
  e.preventDefault();
  setSelectedFile(filteredFilesModal[fileSearchIndex].name);
  setShowFileSearchModal(false);
}

This immediately switches to the selected file and closes the modal.

Theme Switching

Open Theme Selector (Alt+T)

Opens the theme selection modal with a searchable list of all themes.

Implementation: page.tsx:389-395

if (e.altKey && e.key === 't') {
  e.preventDefault();
  setShowThemeModal(true);
  setThemeSearchQuery('');
  setThemeIndex(themes.findIndex(t => t.value === theme));
  setTimeout(() => themeInputRef.current?.focus(), 50);
}

What happens:

• Opens the theme selector modal
• Clears the search query
• Pre-selects the currently active theme
• Focuses the search input for immediate typing

The current theme is pre-selected, so you can immediately press ↓ to preview the next theme.

Navigate Themes (↑ / ↓)

When the theme selector is open, arrow keys navigate through available themes.

Implementation: page.tsx:397-404

• ↓ Arrow Down: Move to next theme (with filtering applied)
• ↑ Arrow Up: Move to previous theme

As you navigate, you’ll see a visual preview of each theme’s background color.

Apply Theme (Enter)

Press Enter to apply the currently highlighted theme.

Implementation: page.tsx:405-409

if (e.key === 'Enter' && filteredThemes.length > 0) {
  e.preventDefault();
  setTheme(filteredThemes[themeIndex].value);
  setShowThemeModal(false);
}

The theme is applied immediately and saved to localStorage.

Navigation

Close Modal (Esc)

Press Esc to close any open modal without making changes.

Implementation: page.tsx:426-429

if (e.key === 'Escape') {
  setShowThemeModal(false);
  setShowFileSearchModal(false);
}

This works for both the file search modal and theme selector.

Markdown Navigation

While viewing markdown content, you can use standard browser shortcuts:

• Scroll: Space, Page Down, Page Up, Arrow keys
• Find in page: Ctrl+F / Cmd+F (browser default)
• Zoom: Ctrl/Cmd +, Ctrl/Cmd -, Ctrl/Cmd 0

Table of Contents Links

When you click a link starting with # in the markdown content, it smoothly scrolls to that heading (page.tsx:147-152).

Implementation Notes

All keyboard shortcuts are implemented in a global event listener attached to the window object (page.tsx:381-434). The listener is cleaned up when the component unmounts to prevent memory leaks.

Cross-Platform Compatibility

File search uses (e.ctrlKey || e.metaKey) to work correctly on both:

• Windows/Linux: Ctrl+K
• macOS: Cmd+K

Focus Management

When modals open, a 50ms timeout ensures the input field is focused after the modal renders:

setTimeout(() => fileSearchInputRef.current?.focus(), 50);

This provides a smooth user experience and allows immediate typing.

Event Prevention

All shortcuts call e.preventDefault() to avoid triggering browser default behaviors:

• Ctrl+K normally opens browser’s search bar
• Alt+T might trigger browser menu items
• Escape might exit fullscreen mode

Summary Table

Shortcut	Action	Context	Implementation
Ctrl/Cmd+K	Open file search	Global	page.tsx:382
Alt+T	Open theme selector	Global	page.tsx:389
↑	Previous item	Modal open	page.tsx:398, 413
↓	Next item	Modal open	page.tsx:401, 416
Enter	Confirm selection	Modal open	page.tsx:405, 420
Esc	Close modal	Modal open	page.tsx:426