diff --git a/src/plugins/nonebot_bison/post/custom_post.py b/src/plugins/nonebot_bison/post/custom_post.py
index 6883717..3933b14 100644
--- a/src/plugins/nonebot_bison/post/custom_post.py
+++ b/src/plugins/nonebot_bison/post/custom_post.py
@@ -1,6 +1,9 @@
 from dataclasses import dataclass
+from pathlib import Path
 
 from nonebot.adapters.onebot.v11.message import Message, MessageSegment
+from nonebot.log import logger
+from nonebot.plugin import require
 
 from .abstract_post import AbstractPost, BasePost
 
@@ -9,14 +12,61 @@ from .abstract_post import AbstractPost, BasePost
 class _CustomPost(BasePost):
 
     message_segments: list[MessageSegment]
+    css_path: str = ""  # 模板文件所用css路径
 
     async def generate_text_messages(self) -> list[MessageSegment]:
         return self.message_segments
 
     async def generate_pic_messages(self) -> list[MessageSegment]:
-        ...  # TODO
+        require("nonebot_plugin_htmlrender")
+        from nonebot_plugin_htmlrender import md_to_pic
+
+        pic_bytes = await md_to_pic(
+            md=self._generate_md(), css_path=self._get_css_path()
+        )
+        return [MessageSegment.image(pic_bytes)]
+
+    def _generate_md(self) -> str:
+        md = ""
+
+        for message_segment in self.message_segments:
+            if message_segment.type == "text":
+                md += "{}\n".format(message_segment.data.get("text", ""))
+            elif message_segment.type == "image":
+                try:
+                    # 先尝试获取file的值，没有在尝试获取url的值，都没有则为空
+                    pic_res = message_segment.data.get(
+                        "file", message_segment.data.get("url", "")
+                    )
+                    assert pic_res
+                except AssertionError:
+                    logger.warning("无法获取到图片资源:MessageSegment.image中file/url字段均为空")
+                else:
+                    md += "![Image]({})\n".format(pic_res)
+            else:
+                logger.warning("custom_post不支持处理类型:{}".format(message_segment.type))
+                continue
+
+        return md
+
+    def _get_css_path(self):
+        """返回css路径"""
+        css_path = (
+            str(Path(__file__).parent / "templates" / "custom_post.css")
+            if not self.css_path
+            else self.css_path
+        )
+        return css_path
 
 
 @dataclass
 class CustomPost(_CustomPost, AbstractPost):
-    ...
+    """
+    CustomPost所支持的MessageSegment type为text/image
+
+    通过将text/image转换成对应的markdown语法, 生成markdown文本
+
+    最后使用htmlrender渲染为图片
+    """
+
+    pass
diff --git a/src/plugins/nonebot_bison/post/templates/custom_post.css b/src/plugins/nonebot_bison/post/templates/custom_post.css
new file mode 100644
index 0000000..cc761bc
--- /dev/null
+++ b/src/plugins/nonebot_bison/post/templates/custom_post.css
@@ -0,0 +1,112 @@
+@charset "utf-8";
+
+/**
+ * markdown.css
+ *
+ * This program is free software: you can redistribute it and/or modify it under
+ * the terms of the GNU Lesser General Public License as published by the Free
+ * Software Foundation, either version 3 of the License, or (at your option) any
+ * later version.
+ *
+ * This program is distributed in the hope that it will be useful, but WITHOUT
+ * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
+ * FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more
+ * details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program. If not, see http://gnu.org/licenses/lgpl.txt.
+ *
+ * @project      Weblog and Open Source Projects of Florian Wolters
+ * @version      GIT: $Id$
+ * @package      xhtml-css
+ * @author       Florian Wolters <florian.wolters.85@googlemail.com>
+ * @copyright    2012 Florian Wolters
+ * @cssdoc       version 1.0-pre
+ * @license      http://gnu.org/licenses/lgpl.txt GNU Lesser General Public License
+ * @link         http://github.com/FlorianWolters/jekyll-bootstrap-theme
+ * @media        all
+ * @valid        true
+ */
+
+body {
+    font-family: Helvetica, Arial, Freesans, clean, sans-serif;
+    padding: 1em;
+    margin: auto;
+    max-width: 42em;
+    background: #fefefe;
+}
+
+h1, h2, h3, h4, h5, h6 {
+    font-weight: bold;
+}
+
+h1 {
+    color: #000000;
+    font-size: 28px;
+}
+
+h2 {
+    border-bottom: 1px solid #CCCCCC;
+    color: #000000;
+    font-size: 24px;
+}
+
+h3 {
+    font-size: 18px;
+}
+
+h4 {
+    font-size: 16px;
+}
+
+h5 {
+    font-size: 14px;
+}
+
+h6 {
+    color: #777777;
+    background-color: inherit;
+    font-size: 14px;
+}
+
+hr {
+    height: 0.2em;
+    border: 0;
+    color: #CCCCCC;
+    background-color: #CCCCCC;
+}
+
+p, blockquote, ul, ol, dl, li, table, pre {
+    margin: 15px 0;
+}
+
+code, pre {
+    border-radius: 3px;
+    background-color: #F8F8F8;
+    color: inherit;
+}
+
+code {
+    border: 1px solid #EAEAEA;
+    margin: 0 2px;
+    padding: 0 5px;
+}
+
+pre {
+    border: 1px solid #CCCCCC;
+    line-height: 1.25em;
+    overflow: auto;
+    padding: 6px 10px;
+}
+
+pre>code {
+    border: 0;
+    margin: 0;
+    padding: 0;
+}
+
+a, a:visited {
+    color: #4183C4;
+    background-color: inherit;
+    text-decoration: none;
+}
\ No newline at end of file