πŸ“¦ GPT Markdown for Flutter (without LaTeX)

Pub Version Pub Points GitHub

This package is a lightweight fork of gpt_markdown, optimized for smaller size by removing LaTeX support.

A comprehensive Flutter package for rendering rich Markdown content in your apps, designed for seamless integration with AI outputs like ChatGPT and Gemini.

⭐ If you find this package helpful, please give it a like on pub.flutter-io.cn! Your support means a lot! ⭐


Supported Markdown Features

✨ Feature βœ… Supported πŸ”œ Upcoming
πŸ’» Code Block βœ…
πŸ“Š Table βœ…
πŸ“ Heading βœ…
πŸ“Œ Unordered List βœ…
πŸ“‹ Ordered List βœ…
πŸ”˜ Radio Button βœ…
β˜‘οΈ Check Box βœ…
βž– Horizontal Line βœ…
↩️ Indent βœ…
↩️ BlockQuote βœ…
πŸ–ΌοΈ Image βœ…
✨ Highlighted Text βœ…
βœ‚οΈ Strike Text βœ…
πŸ”΅ Bold Text βœ…
πŸ“œ Italic Text βœ…
πŸ”— Links βœ…
πŸ“± Selectable βœ…
🧩 Custom components βœ…
πŸ“Ž Underline πŸ”œ

✨ Key Features

Render a wide variety of content with full Markdown support, including:

  • List
- Unordered list item
1. Ordered list item
  • Horizontal line
---
  • Links
[<text here>](<href>)
  • Images with size
![<with>x<hight> someText](url)
  • Table
| Name  | Roll |
|-------|------|
| sohag | 1    |

Name Roll
sohag 1
  • Striked text
~~striked text~~
  • Bold text
**Bold text**
  • Italic text
*Italic text*
  • heading texts
# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6
  • Radio button and checkbox
() Unchecked radio
(x) Checked radio
[] Unchecked checkbox
[x] Checked checkbox
  • You can also make the content selectable using SelectionArea widget.

πŸš€ Why Use GPT Markdown?

  • Optimized for AI Outputs: Render ChatGPT and Gemini responses flawlessly in your Flutter apps.
  • Rich Customization: Easily apply custom styles using Flutter widgets like TextStyle.
  • Selectable Content: Enable content selection with SelectionArea.
  • Seamless Integration: Works out of the box with minimal setup.

πŸ› οΈ Getting Started

Run this command:

flutter pub add gpt_markdown 

πŸ“– Usage

Check the documentation here.

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

return GptMarkdown(
    '''
    * This is a unordered list.
    ''',
    style: const TextStyle(
    color: Colors.red,
),

πŸ’‘ ChatGPT Response Examples

## ChatGPT Response

Welcome to ChatGPT! Below is an example of a response with Markdown:

### Markdown Example

You can use Markdown to format text easily. Here are some examples:

- **Bold Text**: **This text is bold**
- *Italic Text*: *This text is italicized*
- [Link](https://www.example.com): [This is a link](https://www.example.com)
- Lists:
  1. Item 1
  2. Item 2
  3. Item 3

### Conclusion

Markdown can be powerful tools for formatting text and mathematical expressions in your Flutter app. If you have any questions or need further assistance, feel free to ask!

Output from gpt_markdown

Screenshot 2024-02-15 at 4 13 59β€―AM

πŸ”— Additional Information

You can find the source code here.