Context Box




Object Preview
Idle State
Welcome to your Custom Game Launcher. This Context Box is perfect for longer text such as patch notes, news summaries, instructions, account messages, or update details. Users can read multiple lines of content in a clean and contained area.
Focused Style Example
Use a stronger style like this when you want the Context Box to feel active, important, or part of a premium launcher flow. This can work nicely for support messages, important notices, changelogs, or feature descriptions.

The Context Box object is a multi-line text area designed for displaying or collecting larger amounts of text within your launcher interface. It is ideal when a standard single-line field would feel too restrictive.

In a Custom Launcher or Custom Game Launcher, Context Boxes are commonly used for longer written content such as news, instructions, patch information, support messages, account notes, or editable text input.

Pro Tip

The Context Box is well suited to any situation where users need more room to read, review, or enter multi-line text.

Context Box Overview

A Context Box gives you a contained area for multi-line text. It can be used either as a readable content area or as an input field, depending on how you configure it.

This makes it a flexible object for both interface presentation and user interaction. Whether you are showing changelog details or allowing the user to type into a larger field, the Context Box provides a clean and familiar format.

Typical Uses

  • Patch notes and update summaries
  • News or announcement text
  • Launcher instructions or help content
  • Support messages or user notices
  • Editable notes or feedback areas
  • Long-form account or profile text

Default Context Box Settings

When a Context Box is first created, it starts with practical defaults so it is immediately visible and ready to use.

Property
Default Value
Default Text
This is a context box. You can enter multiple lines of text here.
Placeholder
Enter text...
Max Length
0
Read Only
False
Disabled
False
Show Scrollbar
True
Text Color
#E0E0E0
Background Color
#222222
Background Alpha
1.0
Font Family
Roboto, sans-serif
Font Size
14
Font Weight
400
Padding
8
Border Width
1
Border Color
#555555
Corner Radius
6

Context Box Properties

The Context Box includes a strong set of content, behaviour, typography, and box styling options. This makes it suitable for both practical text entry and polished presentation areas.

Content

The Default Text property controls the starting text shown inside the Context Box. This is useful when you want the box to begin with existing text already in place.

Placeholder defines the text shown when the field is empty, helping guide the user on what they are expected to enter.

Max Length lets you control how much text can be entered. A value of 0 means there is no character limit.

Behaviour

Read Only allows users to view the content without editing it. This is perfect for patch notes, legal text, status messages, or launcher instructions.

Disabled makes the Context Box non-interactive. This can be useful when the box should remain visible but temporarily unavailable.

Show Scrollbar controls whether a scrollbar appears when the content becomes longer than the visible area.

Typography

The typography options control how the text appears inside the box.

  • Text Color defines the colour of the text.
  • Font Family selects the typeface.
  • Font Size controls text size.
  • Font Weight determines how bold the text appears.
  • Italic enables italic styling.
  • Underline adds an underline to the text.

Box Style

The visual container itself can also be styled in several ways.

  • Background Color defines the main fill colour of the box.
  • Background Alpha controls the transparency level of that background.
  • Padding creates space between the text and the box edges.
  • Corner Radius controls how rounded the corners are.
  • Border Color sets the border colour.
  • Border Width controls the thickness of the border.

These options make it easy to create anything from a subtle dark panel to a more prominent callout area that fits the overall theme of your launcher.

Context Box Events

The Context Box supports several useful events for reacting to user interaction and changes in text content.

On Value Change

This event fires whenever the text value changes. It is useful when you want to respond immediately as the content is edited.

On Enter Pressed

This event fires when the Enter or Return key is pressed while the Context Box is focused. This can be useful for submit-style behaviour or shortcut-driven workflows.

On Focus

This event fires when the Context Box becomes active and ready for input.

On Blur

This event fires when the Context Box loses focus.

Important Notice

If the Context Box is being used for important user input, make sure the overall layout makes it clear when the field is active and ready to edit.

Context Box Actions

The Context Box is commonly used alongside event-driven logic to respond to text input, field focus, and interface state changes.

Because it is often used as part of a wider interface flow, it works especially well in launchers that need editable notes, support forms, setup instructions, or user-facing information areas.

Custom CSS

For users of Developer Edition, the Context Box also supports Custom CSS. This gives you more control over advanced styling so you can create a cleaner, more premium, or more branded presentation.

Pro Tip

Custom CSS is available exclusively in Developer Edition.

Custom CSS Example

The example below shows a more premium electric-blue style for a Context Box. This works especially well in a modern Custom Game Launcher where you want richer visual depth and clearer active-state feedback.


Custom CSS Preview
Need help getting started? This Context Box style works brilliantly for premium notices, changelogs, launcher news, support content, or polished editable areas. Because the styling is stronger, it also helps the box stand out as an active and important part of the interface.

css

background: linear-gradient(180deg, rgba(15, 23, 42, 0.95), rgba(9, 15, 28, 0.96)) !important;
border: 1px solid rgba(96, 165, 250, 0.65) !important;
border-radius: 14px !important;
color: #eaf4ff !important;
font-family: Inter, Arial, sans-serif !important;
font-size: 14px !important;
line-height: 1.6 !important;
padding: 14px 16px !important;
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.14), 0 14px 32px rgba(37, 99, 235, 0.18), inset 0 1px 0 rgba(255,255,255,0.04) !important;
transition: all 0.2s ease !important;
:hover {
 border-color: rgba(96, 165, 250, 0.9) !important;
 box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.2), 0 18px 36px rgba(37, 99, 235, 0.22), inset 0 1px 0 rgba(255,255,255,0.05) !important;
}

This example creates a richer active look using a darker blue-toned surface, a stronger border, improved depth, and a more polished hover response.

Example Use Cases

Patch Notes Panel

A Context Box is perfect for showing update notes or detailed changelog information in a contained scrollable area.

Launcher Instructions

Use it to display setup steps, account guidance, support information, or onboarding text inside your launcher.

Editable Notes Area

It can also serve as a larger editable field where users can type custom content, feedback, or other multi-line information.

Best Practices

Use Read Only for Display-Only Content

If the user should be able to read but not edit the content, enable the read-only setting rather than leaving the box editable.

Keep Padding Comfortable

A little internal spacing makes a huge difference. Context Boxes feel much nicer when the text has breathing room and does not sit cramped against the edges.

Use Clear Visual Hierarchy

If the Context Box is important, give it stronger contrast, a clearer border, or more visual depth so it stands out naturally.

Use Strong Styles Selectively

Premium styling works best when reserved for important sections. If every box glows like a spacecraft dashboard, the interface starts getting a bit dramatic.

Summary

The Context Box is a versatile multi-line text area that works well for both display and input scenarios. With support for content settings, behaviour controls, typography, box styling, useful events, and Developer Edition Custom CSS, it is an excellent choice for richer text areas inside a Custom Launcher.