HTML to Flutter text widget

HTML to Flutter text widget

As a flutter developer, there are instances where the fields you get as response body when making an API call come as HTML tags (p, h1, ul, li, etc), when displaying to your frontend should be in regular text format.

No need to panic, there are ways to go around it.] There is a flutter package called flutter_html. This package helps in rendering HTML and CSS as flutter widgets.

Table of Contents

  • Installation
  • Supported HTML Tags
  • Supported CSS Attributes
  • Parameters
  • Examples


  1. To install this flutter_html package, visit to get the latest version of the package. As of when this article is being published, the latest version is flutter_html: ^2.2.1

Add the following to your pubspec.yaml file:

dependencies:flutter_html: ^2.2.1

OR run this command on your terminal

flutter pub add flutter_html
  1. Install the packages with
flutter pub get
  1. Now in your dart code, you can import the package
import ‘package:flutter_html/flutter_html.dart’

Supported HTML Tags

abbr (2).png

Supported CSS Attributes

abbr (4).png


abbr (3).png


Html (
    data: “
    Test Example
    Try out this example
        <li>web development</li>
        <li>mobile development</li>
        <li>data security</li>
        <li>data management</li>

Let’s assume you are fetching your HTML data from an API, and the backend is returning to you dangerous HTML, you can use this method.

String description = “ ”;
    Data: description,
    defaultTextStyle: TextStyle(
    fontSize: 14;


Flutter is growing with its libraries and community. If there is a static HTML webpage that we want to render in our application, with this flutter_html package, we can render the entire webpage.

Keep the ball rolling and continue moving forward on your mobile development journey.