The Align widget positions any renderable content within a defined space using horizontal and vertical alignment.
When to Use
Use Align when you need to position content within available space. Common scenarios:
- Centering content: Create title screens, center tables or panels for visual emphasis
- Right-aligned output: Align status information, timestamps, or metadata to the right edge
- Vertical positioning: Position headers at the top, footers at the bottom, or center dialogs
For adding spacing around content, use Padder instead. For side-by-side layouts, use Columns or Grid.
Basic Usage
Create aligned content using the static factory methods Align.Left(), Align.Center(), or Align.Right().
public static void BasicAlignExample()
{
var panel = new Panel("Welcome to Spectre.Console!")
.BorderColor(Color.Blue);
var centered = Align.Center(panel);
AnsiConsole.Write(centered);
}
Horizontal Alignment
Position content on the left, center, or right. Left alignment is the default for most widgets.
public static void HorizontalAlignmentExample()
{
var text = new Text("Left Aligned");
AnsiConsole.Write(Align.Left(text));
AnsiConsole.WriteLine();
text = new Text("Center Aligned");
AnsiConsole.Write(Align.Center(text));
AnsiConsole.WriteLine();
text = new Text("Right Aligned");
AnsiConsole.Write(Align.Right(text));
}
Vertical Alignment
Setting Vertical Position
Use vertical alignment with a specified height to position content vertically within a defined space.
public static void VerticalAlignmentExample()
{
var text = new Text("Top Aligned").Centered();
var aligned = Align.Center(text, VerticalAlignment.Top)
.Height(10);
AnsiConsole.Write(aligned);
AnsiConsole.MarkupLine("[grey]---[/]");
text = new Text("Middle Aligned").Centered();
aligned = Align.Center(text, VerticalAlignment.Middle)
.Height(10);
AnsiConsole.Write(aligned);
AnsiConsole.MarkupLine("[grey]---[/]");
text = new Text("Bottom Aligned").Centered();
aligned = Align.Center(text, VerticalAlignment.Bottom)
.Height(10);
AnsiConsole.Write(aligned);
}
Combining Alignments
Combine horizontal and vertical alignment to position content in both dimensions simultaneously.
public static void CombinedAlignmentExample()
{
var content = new Panel("Centered in Both Directions")
.BorderColor(Color.Green)
.RoundedBorder();
var aligned = Align.Center(content, VerticalAlignment.Middle)
.Height(15);
AnsiConsole.Write(aligned);
}
Using Extension Methods
Use the fluent extension methods like TopAligned(), MiddleAligned(), and BottomAligned() for more readable code.
public static void FluentExtensionsExample()
{
var panel = new Panel("Using Fluent Extensions")
.BorderColor(Color.Yellow);
var aligned = Align.Left(panel)
.MiddleAligned()
.Height(8);
AnsiConsole.Write(aligned);
}
Controlling Dimensions
Width
By default, Align uses the content's natural width. Use Width() to define the alignment container's width.
public static void WidthControlExample()
{
var text = new Markup("[bold blue]Auto Width[/]");
var autoWidth = Align.Center(text);
AnsiConsole.Write(autoWidth);
AnsiConsole.WriteLine();
text = new Markup("[bold green]Fixed Width (60)[/]");
var fixedWidth = Align.Center(text)
.Width(60);
AnsiConsole.Write(fixedWidth);
}
Height
Set an explicit height with Height() when using vertical alignment to define the vertical space.
Practical Examples
Multiple Alignments
Create layouts with different horizontal alignments for visual variety or functional purpose.
public static void MultipleAlignmentsExample()
{
var leftPanel = new Panel("Left Panel")
.BorderColor(Color.Red);
AnsiConsole.Write(Align.Left(leftPanel));
AnsiConsole.WriteLine();
var centerPanel = new Panel("Center Panel")
.BorderColor(Color.Green);
AnsiConsole.Write(Align.Center(centerPanel));
AnsiConsole.WriteLine();
var rightPanel = new Panel("Right Panel")
.BorderColor(Color.Blue);
AnsiConsole.Write(Align.Right(rightPanel));
}
Centering Tables
Center tables to draw focus and improve presentation for data displays.
public static void AlignTableExample()
{
var table = new Table()
.Border(TableBorder.Rounded)
.BorderColor(Color.Purple)
.AddColumn("Product")
.AddColumn("Price");
table.AddRow("Coffee", "$3.50");
table.AddRow("Tea", "$2.50");
table.AddRow("Pastry", "$4.00");
var centered = Align.Center(table);
AnsiConsole.Write(centered);
}
Advanced Usage
Nested Alignment
Combine Align with containers like Panel to create multi-level alignment for complex layouts.
public static void NestedAlignExample()
{
var innerText = new Markup("[bold yellow]Inner Content[/]");
var innerPanel = new Panel(innerText)
.BorderColor(Color.Yellow)
.RoundedBorder();
var outerPanel = new Panel(Align.Center(innerPanel))
.Header("[bold blue]Outer Container[/]")
.BorderColor(Color.Blue)
.Expand();
AnsiConsole.Write(outerPanel);
}
Title Screens
Use centered alignment for application splash screens or welcome messages.
public static void TitleScreenExample()
{
var title = new FigletText("Spectre")
.Color(Color.Blue);
var subtitle = new Markup("[italic grey]A modern .NET console library[/]");
var titleAligned = Align.Center(title);
var subtitleAligned = Align.Center(subtitle);
AnsiConsole.Write(titleAligned);
AnsiConsole.Write(subtitleAligned);
AnsiConsole.WriteLine();
var instructions = new Markup("[dim]Press any key to continue...[/]");
AnsiConsole.Write(Align.Center(instructions));
}
API Reference
Represents a renderable used to align content.
Constructors
Align(IRenderable renderable, HorizontalAlignment horizontal, Nullable<VerticalAlignment> vertical)Initializes a new instance of the class.
Parameters:
renderable (IRenderable)horizontal (HorizontalAlignment)vertical (Nullable<VerticalAlignment>)Properties
Height
: Nullable<int>Gets or sets the height.
Horizontal
: HorizontalAlignmentGets or sets the horizontal alignment.
Vertical
: Nullable<VerticalAlignment>Gets or sets the vertical alignment.
Width
: Nullable<int>Gets or sets the width.
Extension Methods
Align BottomAligned()Sets the object to be bottom aligned.
Returns:
The same instance so that multiple calls can be chained.
IEnumerable<Segment> GetSegments(IAnsiConsole console)Gets the segments for a renderable using the specified console.
Parameters:
console (IAnsiConsole)Returns:
An enumerable containing segments representing the specified .
Align Height(Nullable<int> height)Sets the height.
Parameters:
height (Nullable<int>)Returns:
The same instance so that multiple calls can be chained.
Align MiddleAligned()Sets the object to be middle aligned.
Returns:
The same instance so that multiple calls can be chained.
Align TopAligned()Sets the object to be top aligned.
Returns:
The same instance so that multiple calls can be chained.
Align VerticalAlignment(Nullable<VerticalAlignment> vertical)Sets the vertical alignment.
Parameters:
vertical (Nullable<VerticalAlignment>)Returns:
The same instance so that multiple calls can be chained.
Align Width(Nullable<int> width)Sets the width.
Parameters:
width (Nullable<int>)Returns:
The same instance so that multiple calls can be chained.