textkit 1.0.0 copy "textkit: ^1.0.0" to clipboard
textkit: ^1.0.0 copied to clipboard

A Flutter package providing easy-to-use text widgets with beautiful visual effects including gradients, shadows, and outlines. Create stunning text with GradientText, ShadowText, and StrokeText widget [...]

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:textkit/text_kit.dart';

void main() {
  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'TextKit Example',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const TextKitExample(),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('TextKit Examples'),
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
      ),
      body: SingleChildScrollView(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            const Text(
              'GradientText Examples',
              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 16),
            const GradientText(
              'Linear Gradient Text',
              colors: [Colors.blue, Colors.purple],
              style: TextStyle(fontSize: 32, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 8),
            const GradientText(
              'Vertical Gradient',
              colors: [Colors.red, Colors.orange, Colors.yellow],
              begin: Alignment.topCenter,
              end: Alignment.bottomCenter,
              style: TextStyle(fontSize: 28),
            ),
            const SizedBox(height: 8),
            const GradientText(
              'Rainbow Gradient',
              colors: [
                Colors.red,
                Colors.orange,
                Colors.yellow,
                Colors.green,
                Colors.blue,
                Colors.indigo,
                Colors.purple,
              ],
              style: TextStyle(fontSize: 24),
            ),
            const SizedBox(height: 32),
            const Text(
              'ShadowText Examples',
              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 16),
            const ShadowText(
              'Single Shadow',
              shadows: [
                Shadow(
                  offset: Offset(2, 2),
                  blurRadius: 4,
                  color: Colors.black54,
                ),
              ],
              style: TextStyle(
                fontSize: 32,
                fontWeight: FontWeight.bold,
                color: Colors.white,
              ),
            ),
            const SizedBox(height: 8),
            Container(
              color: Colors.grey[200],
              padding: const EdgeInsets.all(8),
              child: const ShadowText(
                'Multiple Shadows',
                shadows: [
                  Shadow(
                    offset: Offset(2, 2),
                    blurRadius: 4,
                    color: Colors.black54,
                  ),
                  Shadow(
                    offset: Offset(-2, -2),
                    blurRadius: 4,
                    color: Colors.blue,
                  ),
                ],
                style: TextStyle(
                  fontSize: 28,
                  fontWeight: FontWeight.bold,
                  color: Colors.white,
                ),
              ),
            ),
            const SizedBox(height: 8),
            ShadowText(
              'Glow Effect',
              shadows: [
                const Shadow(
                  offset: Offset.zero,
                  blurRadius: 10,
                  color: Colors.purple,
                ),
                Shadow(
                  offset: Offset.zero,
                  blurRadius: 20,
                  color: Colors.purple.withValues(alpha: 0.5),
                ),
              ],
              style: const TextStyle(
                fontSize: 32,
                fontWeight: FontWeight.bold,
                color: Colors.purple,
              ),
            ),
            const SizedBox(height: 32),
            const Text(
              'StrokeText Examples',
              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 16),
            Container(
              color: Colors.blue[100],
              padding: const EdgeInsets.all(8),
              child: const StrokeText(
                'Outlined Text',
                strokeColor: Colors.black,
                strokeWidth: 2.0,
                style: TextStyle(
                  fontSize: 32,
                  fontWeight: FontWeight.bold,
                  color: Colors.white,
                ),
              ),
            ),
            const SizedBox(height: 8),
            Container(
              color: Colors.grey[900],
              padding: const EdgeInsets.all(8),
              child: const StrokeText(
                'Neon Effect',
                strokeColor: Colors.cyan,
                strokeWidth: 3.0,
                style: TextStyle(
                  fontSize: 36,
                  fontWeight: FontWeight.bold,
                  color: Colors.cyan,
                ),
              ),
            ),
            const SizedBox(height: 8),
            Container(
              color: Colors.white,
              padding: const EdgeInsets.all(8),
              child: const StrokeText(
                'Stroke Only',
                strokeColor: Colors.red,
                strokeWidth: 2.5,
                fillText: false,
                style: TextStyle(
                  fontSize: 28,
                  fontWeight: FontWeight.bold,
                ),
              ),
            ),
            const SizedBox(height: 8),
            Container(
              color: Colors.yellow[100],
              padding: const EdgeInsets.all(8),
              child: const StrokeText(
                'Bold Outline',
                strokeColor: Colors.deepOrange,
                strokeWidth: 4.0,
                style: TextStyle(
                  fontSize: 30,
                  fontWeight: FontWeight.bold,
                  color: Colors.orange,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
4
likes
150
points
95
downloads

Publisher

verified publisherflutterengine.com

Weekly Downloads

A Flutter package providing easy-to-use text widgets with beautiful visual effects including gradients, shadows, and outlines. Create stunning text with GradientText, ShadowText, and StrokeText widgets for modern Flutter applications.

Repository (GitHub)
View/report issues

Topics

#flutter-textkit #text-effects #gradient-text #shadow-text #outline-stroke-text

Documentation

Documentation
API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on textkit