Skip to main content

Get Started - User Interface Areas

TagSpaces opens as a single-window application designed to maximize space usage, whether on large screens or small mobile displays. Its user interface follows Google's Material Design guidelines, making it adaptable and consistent across operating systems and platforms.

This streamlined experience ensures ease of use across platforms, so once you're familiar with the features, you can use them anywhere. The image below shows a typical start screen, with a list of available locations on the left and the content of the currently opened folder in the center, using the default perspective.

Explanation of the application's user interface areas

The application's user interface consists of the following main areas:

  1. Left Drawer - Open the location manager or tag library and access other important app functionalities like settings.
  2. Navigation and Search - Use this area to search, switch locations, or navigate to parent folders.
  3. Browsing Area - The central section for browsing files and folders using various perspectives.
  4. Common Actions Area - Access actions for the currently opened file or folder.
  5. File / Folder Properties - View the properties of the opened file or folder.
  6. File Preview - Preview and/or edit the current file here.

Left Drawer​

The main drawer is divided into three sub-areas:

Top Area: Displays the app's logo and version. Clicking the logo opens the About dialog, where you can check licensing details and new versions. Below the logo, the Create button opens a dialog to create files, and the New Window button opens a new TagSpaces window or tab. The bottom part of the drawer contains six buttons. The gear icon (1) on the left opens the settings. The rightmost button (6) toggles between light and dark themes. In the TagSpaces Enterprise version, this button opens the logged user's properties.

Radio Buttons: Switch between different areas:

Drawer toolbar

The file browsing area displays files from the active folder in various views (list, grid, or kanban), depending on the active perspective. Learn more in the perspective section.

Screenshot showing the file browsing area

  • (1) - Toggles the left drawer.
  • (2) - Navigates back to the last opened file, folder, or location (beta).
  • (3) - Reverts the previous navigation step.
  • (4) - Opens search.
  • (5) - Displays parent folders as buttons, enabling navigation.
  • (6) - Displays the current folder's name, which opens the folder menu.
  • (7) - Switches the perspective of the current folder.
tip

In cloud-based locations, the folder icon in (5) will be a cloud. Otherwise, it will be a briefcase.

Folder Menu​

The folder menu includes options such as:

  • Reload, rename, or delete the folder.
  • Open the folder in the operating system's file manager.
  • Create new files, subfolders, or add files.
  • Import macOS tags (only on macOS desktop app).
  • Switch between different perspectives: Grid, List, Gallery, Mapique, Kanban.
  • Access folder properties.

Preview Area​

When a file is opened, the main UI splits into two areas, with the right side becoming the Preview Area. TagSpaces supports displaying various file types, from markdown to PDFs and images. For more details, see Previewing Files and Editing Files.

Area for previewing and editing files

  • (1) Title Area - Displays the file's name and extension, with options to bookmark and tag it.
  • (2) Edit & Close - Close the file or folder, enable edit mode, and toggle auto-save for text files.
  • (3) File / Folder Toolbar - Contains actions for the opened file or folder.
  • (4) Navigation - Navigate between files in the current folder or search results.
  • (5) Preview & Edit Area - Displays the file preview and offers editing options for supported file types.

Dark Mode and Themes​

Themes can be changed in the general settings.

Light and Dark Themes

Multiple Windows and Tabs​

TagSpaces supports multiple windows or tabs in the web versions. You can open locations, folders, or files in new windows/tabs, or start a new instance of the application.

Opening a location in a new window

Scalable User Interface​

TagSpaces' UI is scalable, allowing you to adjust the zoom factor according to your screen. Access the zoom options from the View menu. Options include zoom in, zoom out, and resetting the zoom to its default.

Zoom menu options

  • Zoomed In Interface:

Zoomed In Interface

tip

In a browser, use the built-in zoom functionality.

Full Screen Mode​

The desktop app supports full screen mode, which can be toggled by pressing F11 or selecting View -> Toggle Fullscreen from the Main Menu.

Toggle Fullscreen

tip

In a browser, use the browser's full screen capabilities.

Tray Menu​

On Windows, macOS, and Linux, starting the desktop app loads a tray menu integrated into the operating system.

Tray Menu on macOS
Tray Menu on macOS

The tray menu offers the following functionalities:

  • Show TagSpaces - Ctrl+Shift+W / Cmd+Shift+W
  • Show Search - Ctrl+Shift+F / Cmd+Shift+F
  • New File / Note - Ctrl+Shift+N / Cmd+Shift+N
  • Open Next File - Ctrl+Shift+D / Cmd+Shift+D
  • Open Previous File - Ctrl+Shift+P / Cmd+Shift+P
  • Pause/Resume Playback - Ctrl+Shift+P / Cmd+Shift+P
  • Quit TagSpaces - Ctrl+Q / Cmd+Q
tip

These key combinations are available globally and can be used even if TagSpaces is not in focus. They can be disabled in the settings.