Charm - Layout & Sizing

Layout Your Terminal Output

Lip Gloss supports web-inspired layout and sizing options, like text alignment and width/height settings, to create clean, structured terminal interfaces. Whether you’re building a CLI or a Bubble Tea TUI, Lip Gloss makes layout intuitive and familiar.

Combine layout and sizing with colors and formatting for polished terminal apps.

Layout and Sizing Options

Lip Gloss provides tools to align text and set dimensions:

Align paragraphs of text to the left, right, or center:

var style = lipgloss.NewStyle().
    Width(24).
    Align(lipgloss.Left).  // align it left
    Align(lipgloss.Right). // no wait, align it right
    Align(lipgloss.Center) // just kidding, align it in the center

Set minimum width and height for consistent sizing:

var style = lipgloss.NewStyle().
    SetString("What’s for lunch?").
    Width(24).
    Height(32).
    Foreground(lipgloss.Color("63"))

How It Works

Apply layout and sizing to enhance your terminal output:

Choose Layout Options

Select alignment (left, right, center) or sizing (width, height) based on your interface needs.

Apply Styles

Use lipgloss.NewStyle() to define alignment and dimensions, then apply to text:

style := lipgloss.NewStyle().
    Width(24).
    Align(lipgloss.Center)
fmt.Println(style.Render("Centered text!"))

Combine with Other Styling

Pair alignment and sizing with colors or formatting for a cohesive look, as shown in the Width and Height example.

Ensure your terminal supports sufficient width for alignment and sizing to render correctly. Modern terminals like iTerm2 or Alacritty are recommended.