Spax

A lightweight Flutter package that makes padding, spacing, border radius, and widget gaps cleaner and more readable.

✨ Features

  • Simple padding extensions
  • Full custom EdgeInsets support
  • SizedBox spacing extensions
  • BorderRadius extensions
  • Zero dependencies
  • Lightweight and developer-friendly

Installation

Add the dependency to your pubspec.yaml:

dependencies:
  spax: ^1.0.0

Import the package:

import 'package:spax/spax.dart';

Padding Extensions

Extension Equivalent
Text('Hello').t(10) EdgeInsets.only(top: 10)
Text('Hello').b(10) EdgeInsets.only(bottom: 10)
Text('Hello').l(10) EdgeInsets.only(left: 10)
Text('Hello').r(10) EdgeInsets.only(right: 10)
Text('Hello').hs(20) EdgeInsets.symmetric(horizontal: 20)
Text('Hello').hv(20) EdgeInsets.symmetric(vertical: 20)
Text('Hello').all(20) EdgeInsets.all(20)

Custom Padding

Text('Hello').p(
  t: 10,
  l: 20,
  r: 20,
)

Equivalent:

EdgeInsets.only(
  top: 10,
  left: 20,
  right: 20,
)

Symmetric Padding

Text('Hello').ps(
  h: 20,
  v: 10,
)

Equivalent:

EdgeInsets.symmetric(
  horizontal: 20,
  vertical: 10,
)

SizedBox Extensions

Height Spacer

20.h

Equivalent:

SizedBox(height: 20)

Width Spacer

20.w

Equivalent:

SizedBox(width: 20)

Example:

Column(
  children: [
    Text('Email'),
    12.h,
    Text('Password'),
    20.h,
    ElevatedButton(
      onPressed: () {},
      child: Text('Login'),
    ),
  ],
)

Radius Extensions

BorderRadius

16.r

Equivalent:

BorderRadius.circular(16)

Radius

12.cr

Equivalent:

Radius.circular(12)

Example:

Container(
  decoration: BoxDecoration(
    borderRadius: 16.r,
  ),
)

BorderRadius.only(
  topLeft: 12.cr,
  topRight: 12.cr,
)

Complete Example

import 'package:flutter/material.dart';
import 'package:spax/spax.dart';

class ExampleScreen extends StatelessWidget {
  const ExampleScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          30.h,

          Container(
            width: 150,
            height: 150,
            decoration: BoxDecoration(
              color: Colors.blue,
              borderRadius: 16.r,
            ),
          ),

          20.h,

          Text('Custom Padding').p(
            t: 10,
            l: 20,
            r: 20,
          ),

          20.h,

          Text('Quick Padding')
              .t(10)
              .hs(20),

          20.h,

          Row(
            mainAxisAlignment:
                MainAxisAlignment.center,
            children: [
              Container(
                width: 60,
                height: 60,
                color: Colors.red,
              ),

              20.w,

              Container(
                width: 60,
                height: 60,
                color: Colors.green,
              ),
            ],
          ),
        ],
      ),
    );
  }
}

Why Spax?

Flutter UI code often becomes repetitive.

Instead of:

Padding(
  padding: EdgeInsets.only(
    top: 10,
  ),
  child: Text('Hello'),
)

You can simply write:

Text('Hello').t(10)

Instead of:

SizedBox(height: 20)

You can write:

20.h

Instead of:

BorderRadius.circular(16)

You can write:

16.r

Spax helps reduce boilerplate and keeps UI code clean, readable, and expressive.

Author

Sanket C Panchal

Flutter Developer & Open Source Contributor

License

MIT License

Copyright (c) 2026 Sanket C Panchal

See the LICENSE file for details.

Libraries

spax