The Text
widget in Flutter is one of the most commonly used widgets for displaying a string of text with single style. Whether you’re building a simple UI or a complex app interface, understanding how to use Text
effectively is essential for any Flutter developer.

What Is Text Widget?
The Text
widget allows you to display styled or unstyled text on the screen. It is very flexible and supports a wide range of text styling options like font size, color, weight, spacing, alignment, overflow, and more.
Basic Usage Example
import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key}); @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar(title: const Text('Text Widget Example')), body: const Center( child: Text( 'Hello, Flutter!', style: TextStyle( fontSize: 24, fontWeight: FontWeight.bold, color: Colors.blue, ), ), ), ), ); } }
In this example, we create a simple Flutter app that shows “Hello, Flutter!” in bold, blue text with a font size of 24.
Customizing Text Widget
You can further customize the text using properties such as:
textAlign
: Aligns text (e.g.,TextAlign.center
)maxLines
: Limits the number of linesoverflow
: Handles overflow like ellipsisstyle
: Applies styles usingTextStyle
Example with more customization:
Text( 'This is a very long text that might overflow.', maxLines: 1, overflow: TextOverflow.ellipsis, textAlign: TextAlign.center, style: TextStyle( fontSize: 16, color: Colors.black54, ), )
For official documentation and advanced styling, you can visit the Flutter docs:
https://api.flutter.dev/flutter/widgets/Text-class.html
Final Thoughts
Learning how to use the Text
widget efficiently will help you build better and more readable UIs. Practice with different properties to understand how it behaves in different screen sizes and layouts.