Skip to main content

​
Overview

Mango provides 12 built-in layouts for organizing windows automatically. Each layout implements a different arrangement algorithm, and you can assign different layouts to different tags.

​
Available Layouts

​
Master-Stack Layouts

These layouts divide the screen into a master area and a stack area.

​
Tile (T)

The classic master-stack layout with horizontal split: 
┌─────────┬─────┐
│         │  2  │
│    1    ├─────┤
│ (Master)│  3  │
│         ├─────┤
│         │  4  │
└─────────┴─────┘
Configuration: 
tagrule=id:1,layout_name:tile
default_mfact=0.55      # Master area takes 55% of width
default_nmaster=1       # One window in master by default
new_is_master=1         # New windows become master

​
Vertical Tile (VT)

Master-stack layout with vertical split: 
┌─────────────────┐
│        1        │
│    (Master)     │
├─────┬─────┬─────┤
│  2  │  3  │  4  │
└─────┴─────┴─────┘
Use case: Wide-screen displays, horizontal workflows

​
Center Tile (CT)

Master in center with stacks on both sides: 
┌───┬─────────┬───┐
│ 3 │         │ 2 │
├───┤    1    ├───┤
│ 5 │ (Master)│ 4 │
├───┤         ├───┤
│ 7 │         │ 6 │
└───┴─────────┴───┘
Use case: Focus on main window while keeping references visible

​
Right Tile (RT)

Master on the right side: 
┌─────┬─────────┐
│  2  │         │
├─────┤    1    │
│  3  │ (Master)│
├─────┤         │
│  4  │         │
└─────┴─────────┘
Use case: Right-handed workflows, keeping main content on dominant side

​
Scroller Layouts

Scrolling layouts where windows can extend beyond screen bounds.

​
Scroller (S)

Horizontal scrolling stack: 
┌────┬────┬────┬───→
│ 1  │ 2  │ 3  │ ...
└────┴────┴────┴───→
Configuration: 
tagrule=id:2,layout_name:scroller
scroller_default_proportion=0.8         # Each window takes 80% of width
scroller_focus_center=0                 # Focus position
scroller_prefer_center=0                # Prefer centering focused window
scroller_default_proportion_single=1.0  # Single window takes full width
scroller_proportion_preset=0.5,0.8,1.0  # Quick proportion presets
Key features:
  • Windows can scroll horizontally
  • Adjustable window proportions
  • Focus-based scrolling
  • Ideal for comparing multiple documents side-by-side
Keybindings for scroller: 
bind=ALT,e,set_proportion,1.0           # Set window to full width
bind=ALT,x,switch_proportion_preset,    # Cycle through presets

​
Vertical Scroller (VS)

Vertical scrolling stack: 
┌────────┐
│   1    │
├────────┤
│   2    │
├────────┤
│   3    │
↓        ↓
Use case: Document review, vertical content navigation

​
Grid Layouts

Evenly distributed window arrangements.

​
Grid (G)

Automatic grid with equal-sized windows: 
# 4 windows:
┌──────┬──────┐
│  1   │  2   │
├──────┼──────┤
│  3   │  4   │
└──────┴──────┘

# 5 windows:
┌─────┬─────┬─────┐
│  1  │  2  │  3  │
├─────┴─────┼─────┤
│     4     │  5  │
└───────────┴─────┘
Use case: Monitoring multiple applications, comparison tasks

​
Vertical Grid (VG)

Grid optimized for vertical splits

​
Deck Layouts

Card-stack style with focus on one window.

​
Deck (K)

Master visible with stack behind: 
┌─────────┬─┐
│         │█│  ← Stack indicators
│    1    │█│
│ (Focus) │█│
│         │█│
└─────────┴─┘
Use case: Single-focus workflows with quick access to background tasks

​
Vertical Deck (VK)

Deck with vertical orientation

​
Special Layouts

​
Monocle (M)

One window at a time, fullscreen: 
┌─────────────────┐
│                 │
│        1        │
│   (Fullscreen)  │
│                 │
└─────────────────┘
Use case: Focused work, presentations, maximizing screen real estate

​
TGMix (TG)

Mixed layout that adapts based on window count:
  • 1-3 windows: Tile layout
  • 4+ windows: Grid layout
Use case: Adaptive workflow that changes with task complexity

​
Layout Configuration

​
Switching Layouts

# Cycle through available layouts
bind=SUPER,n,switch_layout

​
Per-Tag Layout Assignment

Each tag can have a default layout: 
tagrule=id:1,layout_name:tile
tagrule=id:2,layout_name:scroller
tagrule=id:3,layout_name:grid
tagrule=id:4,layout_name:monocle

​
Master-Stack Settings

Fine-tune master-stack layouts: 
# Master area configuration
default_mfact=0.55      # Master takes 55% of screen
default_nmaster=1       # One window in master
new_is_master=1         # New windows enter master area

# Gap configuration
gappih=5                # Inner horizontal gap
gappiv=5                # Inner vertical gap
gappoh=10               # Outer horizontal gap
gappov=10               # Outer vertical gap
smartgaps=0             # Hide gaps when single window

​
Resizing Tiled Windows

You can dynamically resize windows in tiling layouts: 
# Resize windows in tiling mode
bind=CTRL+ALT,Up,resizewin,+0,-50
bind=CTRL+ALT,Down,resizewin,+0,+50
bind=CTRL+ALT,Left,resizewin,-50,+0
bind=CTRL+ALT,Right,resizewin,+50,+0
Interactive resizing:
  • Drag window borders with SUPER + btn_right
  • Adjusts master/stack proportions
  • Changes persist per window

​
Layout Gaps

​
Gap Types

  • Inner gaps (gappih, gappiv): Space between windows
  • Outer gaps (gappoh, gappov): Space from screen edges

​
Gap Management

# Adjust gaps dynamically
bind=ALT+SHIFT,X,incgaps,1      # Increase gaps
bind=ALT+SHIFT,Z,incgaps,-1     # Decrease gaps
bind=ALT+SHIFT,R,togglegaps     # Toggle gaps on/off

​
Advanced Layout Features

​
Per-Client Size Proportions

Mango tracks individual window size preferences: 
// Master/stack proportions per client
double master_mfact_per;    // Master area ratio
double master_inner_per;     // Position within master
double stack_inner_per;      // Position within stack
These allow:
  • Windows to maintain relative sizes when layout changes
  • Smooth transitions between layouts
  • Personalized window sizing

​
Layout Arrangement Algorithm

The arrange() function:
  1. Pre-calculation (pre_caculate_before_arrange):
    • Count visible windows
    • Calculate proportions
    • Determine master/stack assignments
  2. Layout execution:
    • Call layout-specific arrange function
    • Respect per-client proportions
    • Apply gaps and borders
  3. Post-processing:
    • Update window positions
    • Trigger animations
    • Refresh status

​
Dynamic Proportion Adjustment

For tile layouts, you can resize interactively: 
resize_tile_client(grabc, isdrag, offsetx, offsety, time);
This handles:
  • Mouse dragging on window borders
  • Keyboard-based resizing
  • Master/stack ratio adjustment
  • Inner proportion changes

​
Layout-Specific Window Rules

Some window rules interact with layouts: 
# Force window to be floating (ignore layout)
windowrule=appid:floating-app,isfloating:1

# Force maximize (ignore tiling)
windowrule=appid:video-player,force_maximize:1

​
Layout Implementation

Layouts are defined in src/layout/layout.h: 
typedef struct {
    const char *symbol;      // Display symbol (e.g., "T", "S")
    void (*arrange)(Monitor *); // Arrangement function
    const char *name;        // Full name for config
    uint32_t id;            // Unique identifier
} Layout;
Each layout implements its own arrange() function that positions windows according to its algorithm.

​
Best Practices

Layout Selection

Choose layouts based on task:
  • Tile: General multitasking
  • Scroller: Document comparison, code review
  • Grid: Monitoring, dashboards
  • Monocle: Focus work, presentations
  • Center Tile: Main task with references

Tag-Layout Pairing

Assign task-appropriate layouts:
tagrule=id:1,layout_name:tile       # Development
tagrule=id:2,layout_name:monocle    # Writing
tagrule=id:3,layout_name:grid       # Monitoring
tagrule=id:4,layout_name:scroller   # Research

Build docs developers (and LLMs) love

Get started for freeTalk to us