diff --git a/lib/common/widgets/article_content.dart b/lib/common/widgets/article_content.dart
index c222f220..71ec1885 100644
--- a/lib/common/widgets/article_content.dart
+++ b/lib/common/widgets/article_content.dart
@@ -1,7 +1,9 @@
 import 'package:PiliPalaX/common/widgets/network_img_layer.dart';
 import 'package:PiliPalaX/models/dynamics/article_content_model.dart';
+import 'package:PiliPalaX/pages/preview/view.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_html/flutter_html.dart';
+import 'package:get/get.dart';
 
 class ArticleContent extends StatelessWidget {
   const ArticleContent({
@@ -30,12 +32,26 @@ class ArticleContent extends StatelessWidget {
           );
         } else if (item.attributes?.clazz == 'normal-img') {
           return LayoutBuilder(
-            builder: (_, constraints) => NetworkImgLayer(
-              width: constraints.maxWidth,
-              height: constraints.maxWidth *
-                  item.insert.nativeImage?.height /
-                  item.insert.nativeImage?.width,
-              src: item.insert.nativeImage?.url,
+            builder: (_, constraints) => GestureDetector(
+              onTap: () {
+                showDialog(
+                  useSafeArea: false,
+                  context: context,
+                  builder: (context) {
+                    return ImagePreview(
+                      initialPage: 0,
+                      imgList: [item.insert.nativeImage?.url],
+                    );
+                  },
+                );
+              },
+              child: NetworkImgLayer(
+                width: constraints.maxWidth,
+                height: constraints.maxWidth *
+                    item.insert.nativeImage?.height /
+                    item.insert.nativeImage?.width,
+                src: item.insert.nativeImage?.url,
+              ),
             ),
           );
           // return image(
diff --git a/lib/common/widgets/html_render.dart b/lib/common/widgets/html_render.dart
index ede62090..8ecf6a4a 100644
--- a/lib/common/widgets/html_render.dart
+++ b/lib/common/widgets/html_render.dart
@@ -1,3 +1,4 @@
+import 'package:PiliPalaX/pages/preview/view.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_html/flutter_html.dart';
 import '../../utils/storage.dart';
@@ -58,11 +59,25 @@ class HtmlRender extends StatelessWidget {
               //   width: isEmote ? 22 : null,
               //   height: isEmote ? 22 : null,
               // );
-              return NetworkImgLayer(
-                width: isEmote ? 22 : constrainedWidth,
-                height: isEmote ? 22 : 200,
-                src: imgUrl,
-                ignoreHeight: !isEmote,
+              return GestureDetector(
+                onTap: () {
+                  showDialog(
+                    useSafeArea: false,
+                    context: context,
+                    builder: (context) {
+                      return ImagePreview(
+                        initialPage: 0,
+                        imgList: [imgUrl],
+                      );
+                    },
+                  );
+                },
+                child: NetworkImgLayer(
+                  width: isEmote ? 22 : constrainedWidth,
+                  height: isEmote ? 22 : 200,
+                  src: imgUrl,
+                  ignoreHeight: !isEmote,
+                ),
               );
             } catch (err) {
               return const SizedBox();