Skip to Content
Mix 2.0 is in development! You can access the Mix 1.0 docs here.
DocsOverviewGetting started

Getting Started

Prerequisites

Before installing Mix 2.0, ensure you have:

  • Dart SDK: 3.10.0 or higher (required for the fluent Styler API)
  • Flutter: Latest stable version recommended

Mix 2.0 uses Dart’s enhanced method chaining capabilities introduced in Dart 3.10. Ensure your project’s pubspec.yaml specifies the correct SDK constraint: sdk: '>=3.10.0 <4.0.0'

Installation

Install the current 2.0 RC (pre-release):

flutter pub add mix --pre-release

Or pin explicitly in pubspec.yaml:

dependencies: mix: ^2.0.0-rc.0

Import it where you use it:

import 'package:mix/mix.dart';

Your first Mix widget

import 'package:flutter/material.dart'; import 'package:mix/mix.dart'; void main() => runApp(const MyApp()); class MyApp extends StatelessWidget { const MyApp({super.key}); @override Widget build(BuildContext context) { final cardStyle = BoxStyler() .height(100) .width(240) .color(Colors.blue) .borderRounded(12) .borderAll(color: Colors.black, width: 1, style: BorderStyle.solid); return MaterialApp( home: Scaffold( body: Center( child: Box( style: cardStyle, child: StyledText( 'Hello Mix', style: TextStyler().color(Colors.white).fontSize(18), ), ), ), ), ); } }

Reuse the style

Extract it and reuse across widgets:

final primaryCard = BoxStyler() .color(Colors.blue) .borderRounded(12); final box = Box(style: primaryCard, child: StyledText('Primary')); final box2 = Box( style: primaryCard.color(Colors.green), child: StyledText('Success'), );

What’s next