menu_bookDocumentation

s&box Easing Functions: Sandbox.Utility.Easing — Quadratic, Exponential, Bounce, Sine, and CSS-Style Name Lookup

calendar_today May 4, 2026 schedule ~1 min read person patrickjr verified 50

s&box Easing Functions: Sandbox.Utility.Easing for Transitions and Animations

Sandbox.Utility.Easing provides standard easing functions used throughout s&box's UI system and available for game code. All functions take a float in [0, 1] and return a float in [0, 1].

Available Functions

CSHARP
using Sandbox.Utility;

// Linear (no easing)
Easing.Linear( t )

// Quadratic
Easing.QuadraticIn( t )    // slow start, fast end
Easing.QuadraticOut( t )   // fast start, slow end
Easing.QuadraticInOut( t ) // slow start and end

// Exponential
Easing.ExpoIn( t )
Easing.ExpoOut( t )
Easing.ExpoInOut( t )

// Bounce
Easing.BounceIn( t )
Easing.BounceOut( t )
Easing.BounceInOut( t )

// Sine
Easing.SineEaseIn( t )
Easing.SineEaseOut( t )
Easing.SineEaseInOut( t )

// Convenience aliases
Easing.EaseIn( t )    // = QuadraticIn
Easing.EaseOut( t )   // = QuadraticOut
Easing.EaseInOut( t ) // = ExpoInOut

Usage with Lerp

CSHARP
// Ease a value from 0 to 100 over time
float t = (Time.Now - startTime) / duration;
float eased = Easing.QuadraticOut( t.Clamp( 0, 1 ) );
float value = MathX.Lerp( 0f, 100f, eased );

Get Function by CSS Name

The s&box UI system uses CSS-style names for transition and animation properties. You can use the same names in code:

CSHARP
// Available CSS names: "linear", "ease", "ease-in-out", "ease-out", "ease-in"
// "bounce-in", "bounce-out", "bounce-in-out"
// "sin-ease-in", "sin-ease-out", "sin-ease-in-out"

var fn = Easing.GetFunction( "ease-in-out" );  // returns ExpoInOut
float result = fn( t );

// Try-get pattern
if ( Easing.TryGetFunction( "ease-out", out var easeOut ) )
{
    float result = easeOut( t );
}

Custom Easing Functions

CSHARP
// Register a custom easing function (silently ignored if name already exists)
Easing.AddFunction( "my-ease", t => t * t * t );
Was this helpful?