diff --git a/assets/css/tailwind.css b/assets/css/tailwind.css
new file mode 100644
index 0000000000..92cc30454e
--- /dev/null
+++ b/assets/css/tailwind.css
@@ -0,0 +1,13 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer utilities {
+    .line-clamp-5 {
+        overflow: hidden;
+        display: -webkit-box;
+        line-clamp: 5;
+        -webkit-box-orient: vertical;
+        -webkit-line-clamp: 5;
+    }
+}
diff --git a/components/core/header/nav-bar/NavBar.i18n.js b/components/core/header/nav-bar/NavBar.i18n.js
index e15f9770d5..89fd60a6cb 100644
--- a/components/core/header/nav-bar/NavBar.i18n.js
+++ b/components/core/header/nav-bar/NavBar.i18n.js
@@ -33,7 +33,8 @@ export default genI18nMessages({
         accommodation: 'Accommodation',
         proposalSystemUrl: 'Proposal System',
         codeOfConduct: 'Code of Conduct',
-        posterSession: 'Call for Poster',
+        cfpPoster: 'Propose a Poster',
+        posterSession: 'Poster Session',
     },
     'zh-hant': {
         about: '關於',
@@ -67,6 +68,7 @@ export default genI18nMessages({
         accommodation: '住宿資訊',
         proposalSystemUrl: '投稿系統',
         codeOfConduct: '行為準則',
-        posterSession: 'Poster 募集',
+        cfpPoster: '如何投稿海報',
+        posterSession: '海報環節',
     },
 })
diff --git a/components/core/header/nav-bar/nav-bar-items.js b/components/core/header/nav-bar/nav-bar-items.js
index 00ae1b76b9..82c6ad3add 100644
--- a/components/core/header/nav-bar/nav-bar-items.js
+++ b/components/core/header/nav-bar/nav-bar-items.js
@@ -8,7 +8,7 @@ export default Object.freeze({
     ],
     speaking: [
         { i18nKey: 'cfp', value: '/speaking/cfp' },
-        { i18nKey: 'posterSession', value: '/speaking/poster-session' },
+        { i18nKey: 'cfpPoster', value: '/speaking/cfp-poster' },
         { i18nKey: 'talk', value: '/speaking/talk' },
         { i18nKey: 'tutorial', value: '/speaking/tutorial' },
         { i18nKey: 'recording', value: '/speaking/recording' },
@@ -18,6 +18,7 @@ export default Object.freeze({
         { i18nKey: 'talks', value: '/conference/talks' },
         { i18nKey: 'tutorials', value: '/conference/tutorials' },
         { i18nKey: 'panelDiscussion', value: '/conference/panel-discussion' },
+        { i18nKey: 'posterSession', value: '/conference/poster-session' },
     ],
     events: [
         { i18nKey: 'sprints', value: '/events/sprints' },
diff --git a/i18n/about/history.i18n.js b/i18n/about/history.i18n.js
index 94dc0dae9f..e3055ab5d2 100644
--- a/i18n/about/history.i18n.js
+++ b/i18n/about/history.i18n.js
@@ -133,7 +133,7 @@ export default genI18nMessages({
                 'Last year, PyCon Taiwan guided attendees back to physical conferences from the virtual world. ' +
                 'In PyCon Taiwan 2024, we’re taking attendees to Kaohsiung! ' +
                 'Drawing inspiration from other Python Conferences worldwide, this year’s program ' +
-                'introduces Poster Sessions to bridge the gap between speakers and attendees. ' +
+                'introduces Poster Session to bridge the gap between speakers and attendees. ' +
                 'We aim to foster closer connections through face-to-face discussions, sparking creativity and exchanging ideas.',
         },
         terms: {
diff --git a/i18n/about/index.i18n.js b/i18n/about/index.i18n.js
index abd90aa9d2..a6a2561b9b 100644
--- a/i18n/about/index.i18n.js
+++ b/i18n/about/index.i18n.js
@@ -33,7 +33,7 @@ export default genI18nMessages({
             'and at the same time to meet many friends from various parties in the exchange activities.',
         activityDetails: [
             'Speeches include: keynote speeches, general speeches, professional courses',
-            'Activities include: sprint, open space, lightning talk, JobFair, Poster Sessions, PyNight',
+            'Activities include: sprint, open space, lightning talk, JobFair, Poster Session, PyNight',
         ],
         moreInfo:
             'If you want to learn more about each event or want to register for the above events, ' +
@@ -69,7 +69,7 @@ export default genI18nMessages({
             '可以說是非常多元有趣，讓你可以從演講中吸取知識的同時，還能在交流活動中結識許多各方好友。',
         activityDetails: [
             '演講包括：主題演講、一般演講、專業課程',
-            '交流活動包括：衝刺開發、開放空間、閃電秀、Poster Sessions、JobFair、PyNight',
+            '交流活動包括：衝刺開發、開放空間、閃電秀、海報環節、JobFair、PyNight',
         ],
         moreInfo:
             '若想要深入了解各活動或是想要報名以上活動，歡迎到議程總覽頁面觀看。',
diff --git a/i18n/conference/poster-session.i18n.js b/i18n/conference/poster-session.i18n.js
new file mode 100644
index 0000000000..0a83156ec4
--- /dev/null
+++ b/i18n/conference/poster-session.i18n.js
@@ -0,0 +1,410 @@
+import { genI18nMessages } from '~/utils/i18n.utils'
+
+const TypeEnum = {
+    community: 1,
+    professional: 2,
+}
+
+const { community, professional } = TypeEnum
+
+const TypeTranslationZhHant = {
+    [community]: '社群講',
+    [professional]: '專業講',
+}
+
+const TypeTranslationEn = {
+    [community]: 'Community Topics',
+    [professional]: 'Professional Topics',
+}
+
+export default genI18nMessages({
+    'en-us': {
+        title: 'Poster Session',
+        intro: `
+            Poster Session allows speakers to showcase their topics using posters and engage directly with individual audiences. 
+            At PyCon Taiwan 2024, 
+            we'll host the Poster Session for the first time, aiming to provide a platform for more individuals to share their projects or topics of interest. 
+            You are invited to submit a paper on any Python-related topic, which will be exhibited as a poster, enabling you to have direct conversations with attendees.
+        `,
+        posters: [
+            {
+                id: '1',
+                name: 'KK',
+                type: TypeTranslationEn[community],
+                community: 'Taiwan Digital Nomads Hub',
+                topics: [
+                    'Community Connection',
+                    'Communication',
+                    'Your Experiences',
+                ],
+                title: '第一次當總召的我，竟然想在第一屆就辦三百人的年會',
+                summary:
+                    '分享如何舉辦第一屆的三百人年會，包含志工招募、遇到問題與解決方式、大變動等等',
+            },
+            {
+                id: '2',
+                name: '張健勳',
+                type: TypeTranslationEn[professional],
+                community: '',
+                topics: ['Machine Learning'],
+                title: '實現具機器學習功能之智慧化水質分析與評估系統－多元多項式迴歸模型暨前後端程式開發',
+                summary:
+                    '本研究開發具備機器學習功能的智慧水質分析與評估系統，解決水質分析效率不足的問題。採人工智慧技術，運用Scikit-learn建構用於水質分析的多元多項式迴歸（MPR）模型。且為MPR模型建立了API，部署於雲端平臺，讓使用者可透過APP遠端呼叫MPR模型進行水質分析與評估。MPR模型在準確性及擬合度上大幅優於傳統線性迴歸模型。研究跨領域結合資訊與環境工程技術，對人工智慧與生態保育研究發展具有效益。',
+            },
+            {
+                id: '3',
+                name: 'SABIN KATPATTIL',
+                type: TypeTranslationEn[professional],
+                community: '',
+                topics: ['Medical Care'],
+                title: 'Revolutionizing Healthcare: Unraveling the Potential of Machine Learning on Big Data',
+                summary:
+                    'Revolutionizing Healthcare: Unraveling the Potential of Machine Learning on Big Data',
+            },
+            {
+                id: '4',
+                name: 'asmin sha',
+                type: TypeTranslationEn[professional],
+                community: '',
+                topics: ['Machine Learning'],
+                title: 'Towards Enhanced Mental Health Assessment: A Machine Learning-Based Psychological Disorder Analysis System',
+                summary:
+                    'Towards Enhanced Mental Health Assessment: A Machine Learning-Based Psychological Disorder Analysis System',
+            },
+            {
+                id: '5',
+                name: '林育申',
+                type: TypeTranslationEn[professional],
+                community: '',
+                topics: ['Medical Care'],
+                title: 'An Efficient Workflow for Collision Prevention in Planning Using 3D Surface Scan',
+                summary:
+                    '3D 掃描是一種實用且高效的掃描患者體形的方法，可快速建立模型以防止碰撞。未來它還可以用於監測患者日常治療設定錯誤和體形變化。',
+            },
+            {
+                id: '6',
+                name: 'PyLadies Tokyo',
+                type: TypeTranslationEn[community],
+                community: 'PyLadies Tokyo',
+                topics: ['Community Connection'],
+                title: 'Code, Connect, and Enjoy with PyLadies Tokyo!',
+                summary:
+                    "PyLadies Tokyo is one of the PyLaides chapters since 2014, it works to connect women Pythonistas. We'll display to Community Overview, Activities Report. Come see what we're all about and let's talk!",
+            },
+            {
+                id: '7',
+                name: '黃俊毓',
+                type: TypeTranslationEn[community],
+                community: 'Nantou.py',
+                topics: [
+                    'Community Connection',
+                    'Your Experiences',
+                    'Other Community Event',
+                ],
+                title: '以 LLM 打造的 AIoT 孿生系統',
+                summary: `
+                    Nantou.py 在 2024 年以大語言模型 ( LLM ) 與數位孿生框架為主題，展開一系列的社群活動。
+                    階段性的成果，在 COMPUTEX 2024 與國立師範大學一起聯合展示過，
+                    [相關的新聞稿可參考](https://pr.ntnu.edu.tw/ntnunews/index.php?mode=data&id=22618)，本次參與 PyConTW 也將帶來精彩的技術探討。
+                `,
+            },
+            {
+                id: '8',
+                name: 'Mac Taylor',
+                type: TypeTranslationEn[community],
+                community: '開發者 Buffet',
+                topics: [],
+                title: '開發者 Buffet - 高雄開發者Café 月會',
+                summary:
+                    '開發者 Buffet 是由一群在研討會結識的工程師們組織的技術社群，目前固定每週舉辦讀書會、每月的月會，主題包括不限於後端、前端、AI、OS、Mobile、軟實力等，我們希望藉由 Poster 來曝光技術社群活動，凝聚產業的先進，本次在高雄曝光是希望並透過技術活動的活絡來讓高雄的軟體產業因為知識性活動的增加，吸引更多人才願意待在高雄、來高雄工作。',
+            },
+            {
+                id: '9',
+                name: '戴維廷',
+                type: TypeTranslationEn[community],
+                community: 'GDG Kaohsiung',
+                topics: [
+                    'Community Connection',
+                    'Your Experiences',
+                    'Other Community Event',
+                ],
+                title: 'GDG 高雄 の TOOCON の 由來',
+                summary: `
+                        TOOCON 是由 GDG 高雄主辦，堅持大順路以南的中小型軟體相關交流聚會，
+                        因為活動跟二有關連，而且都在晚上舉辦，所以用 TWO 的諧音 TOO，於是中文名稱就叫「天黑黑月會」。
+                        TOOCON 從最初的 8 人到現在的穩定 30 人，分享怎麼從無到有建立 TOOCON 天黑黑月會。
+                    `,
+            },
+            {
+                id: '10',
+                name: '劉倚成',
+                type: TypeTranslationEn[community],
+                community: 'Agile Kaohsiung',
+                topics: [
+                    'Community Connection',
+                    'Your Experiences',
+                    'Other Community Event',
+                ],
+                title: '在地敏捷社群的力量——從團隊到社會的影響',
+                summary:
+                    '介紹敏捷社群的沿革、講者和參與者的多元性與互動性，回顧敏捷社群活動的成就與挑戰，分享社群未來的展望及目標',
+            },
+            {
+                id: '11',
+                name: 'Saurav Jain',
+                type: TypeTranslationEn[professional],
+                community: '',
+                topics: ['Data Extraction'],
+                title: 'Smart Proxy Management in Python: Extract Data Efficiently',
+                summary:
+                    'Efficient web scraping requires overcoming challenges like IP blocking and rate limiting. This poster session explores smart proxy management using Crawlee.',
+            },
+            {
+                id: '12',
+                name: '蔡嘉平',
+                type: TypeTranslationEn[community],
+                community: 'Apache 基金會 & 源來適你',
+                topics: [
+                    'Community Connection',
+                    'Your Experiences',
+                    'Other Community Event',
+                ],
+                title: '從台灣走向國際、從源來適你走向開源',
+                summary: `
+                    參與開源貢獻已經是軟體工程師提昇自我的一個常見道路，
+                    台灣正處與新技術的黃金時代，身為台灣軟體工程師我們更不應該在開源這條道路上掉隊。
+                    本次分享我們將著重在開源技術的介紹、對自我價值的回饋、以及一些成功案例的分享。
+                    此外也會分享「源來適你」如何在這條路上陪伴大家「源來適你」網站：https://www.facebook.com/opensource4you
+                `,
+            },
+            {
+                id: '13',
+                name: 'Calvin TSANG',
+                type: TypeTranslationEn[community],
+                community: 'PyCon Hong Kong',
+                topics: ['Community Connection', 'Your Experiences'],
+                title: 'Pycon HK',
+                summary: '主要介紹 pycon Hong Kong 2024事宜',
+            },
+            {
+                id: '14',
+                name: 'Ivy Fung',
+                type: TypeTranslationEn[community],
+                community: 'PyCon MY',
+                topics: [
+                    'Community Connection',
+                    'Communication',
+                    'Your Experiences',
+                ],
+                title: 'Sustainable Community 可持续社区',
+                summary: `
+                    新冠肆虐给 PyCon MY 带来重创。
+                    社区剩下人数寥寥无几，经费来源也受影响。
+                    主要干部倍感危机，开始寻找让社团可持续的方向。
+                    这是个还在进行的方案，无法给出成果。
+                    目標聚集在以下四點：
+                        1. 社區人數
+                        2. 經費
+                        3. 與其他社區、業界和政府機關的合作
+                        4. 接班人
+                `,
+            },
+            {
+                id: '15',
+                name: 'John Lu',
+                type: TypeTranslationEn[professional],
+                community: '',
+                topics: ['AI'],
+                title: 'Finetune Large Language Models with LoRA using KerasNLP',
+                summary:
+                    'Finetuning LLMs allows us to customize the model for our application. This poster shows how fine-tuning LLMs could be done in a parameter-efficient way with KerasNLP and LoRA.',
+            },
+        ],
+    },
+    'zh-hant': {
+        title: '海報環節',
+        intro: `
+            海報環節（Poster Session）是一個讓投稿者可以透過海報展示其分享內容，並與個別與會者直接互動的一種展示形式。
+            在 PyCon Taiwan 2024 我們初次嘗試 Poster Session 的活動，
+            希望可以讓更多人介紹自己的成果或是關注的議題。您可以投稿任何跟 Python 有關的主題，
+            屆時將以海報形式展出，然後與會者可與您直接互動。
+        `,
+        posters: [
+            {
+                id: '1',
+                name: 'KK',
+                type: TypeTranslationZhHant[community],
+                community: '台灣數位遊牧者社群',
+                topics: ['社群經營', '人際溝通', '經驗分享'],
+                title: '第一次當總召的我，竟然想在第一屆就辦三百人的年會',
+                summary:
+                    '分享如何舉辦第一屆的三百人年會，包含志工招募、遇到問題與解決方式、大變動等等',
+            },
+            {
+                id: '2',
+                name: '張健勳',
+                type: TypeTranslationZhHant[professional],
+                community: '',
+                topics: ['機器學習'],
+                title: '實現具機器學習功能之智慧化水質分析與評估系統－多元多項式迴歸模型暨前後端程式開發',
+                summary: `
+                    本研究開發具備機器學習功能的智慧水質分析與評估系統，解決水質分析效率不足的問題。
+                    採人工智慧技術，運用Scikit-learn建構用於水質分析的多元多項式迴歸（MPR）模型。
+                    且為MPR模型建立了API，部署於雲端平臺，讓使用者可透過APP遠端呼叫MPR模型進行水質分析與評估。
+                    MPR模型在準確性及擬合度上大幅優於傳統線性迴歸模型。
+                    研究跨領域結合資訊與環境工程技術，對人工智慧與生態保育研究發展具有效益。
+                `,
+            },
+            {
+                id: '3',
+                name: 'SABIN KATPATTIL',
+                type: TypeTranslationZhHant[professional],
+                community: '',
+                topics: ['醫療'],
+                title: 'Revolutionizing Healthcare: Unraveling the Potential of Machine Learning on Big Data',
+                summary:
+                    'Revolutionizing Healthcare: Unraveling the Potential of Machine Learning on Big Data',
+            },
+            {
+                id: '4',
+                name: 'asmin sha',
+                type: TypeTranslationZhHant[professional],
+                community: '',
+                topics: ['機器學習'],
+                title: 'Towards Enhanced Mental Health Assessment: A Machine Learning-Based Psychological Disorder Analysis System',
+                summary:
+                    'Towards Enhanced Mental Health Assessment: A Machine Learning-Based Psychological Disorder Analysis System',
+            },
+            {
+                id: '5',
+                name: '林育申',
+                type: TypeTranslationZhHant[professional],
+                community: '',
+                topics: ['醫療'],
+                title: 'An Efficient Workflow for Collision Prevention in Planning Using 3D Surface Scan',
+                summary:
+                    '3D 掃描是一種實用且高效的掃描患者體形的方法，可快速建立模型以防止碰撞。未來它還可以用於監測患者日常治療設定錯誤和體形變化。',
+            },
+            {
+                id: '6',
+                name: 'PyLadies Tokyo',
+                type: TypeTranslationZhHant[community],
+                community: 'PyLadies Tokyo',
+                topics: ['社群經營'],
+                title: 'Code, Connect, and Enjoy with PyLadies Tokyo!',
+                summary: `
+                    PyLadies Tokyo is one of the PyLaides chapters since 2014, 
+                    it works to connect women Pythonistas.we'll display to Community Overview, Activities Report.
+                    Come see what we're all about and let's talk!`,
+            },
+            {
+                id: '7',
+                name: '黃俊毓',
+                type: TypeTranslationZhHant[community],
+                community: 'Nantou.py',
+                topics: ['社群經營', '經驗分享', '社群活動'],
+                title: '以 LLM 打造的 AIoT 孿生系統',
+                summary: `
+                    Nantou.py 在 2024 年以大語言模型 ( LLM ) 與數位孿生框架為主題，展開一系列的社群活動。
+                    階段性的成果，在 COMPUTEX 2024 與國立師範大學一起聯合展示過，
+                    <span class="summary-link">[相關的新聞稿可參考](https://pr.ntnu.edu.tw/ntnunews/index.php?mode=data&id=22618)</span>，本次參與 PyConTW 也將帶來精彩的技術探討。
+                `,
+            },
+            {
+                id: '8',
+                name: 'Mac Taylor',
+                type: TypeTranslationZhHant[community],
+                community: '開發者 Buffet',
+                topics: ['社群活動'],
+                title: '開發者 Buffet - 高雄開發者Café 月會',
+                summary:
+                    '開發者 Buffet 是由一群在研討會結識的工程師們組織的技術社群，目前固定每週舉辦讀書會、每月的月會，主題包括不限於後端、前端、AI、OS、Mobile、軟實力等，我們希望藉由 Poster 來曝光技術社群活動，凝聚產業的先進，本次在高雄曝光是希望並透過技術活動的活絡來讓高雄的軟體產業因為知識性活動的增加，吸引更多人才願意待在高雄、來高雄工作。',
+            },
+            {
+                id: '9',
+                name: '戴維廷',
+                type: TypeTranslationZhHant[community],
+                community: 'GDG 高雄',
+                topics: ['社群經營', '經驗分享', '社群活動'],
+                title: 'GDG 高雄 の TOOCON の 由來',
+                summary: `
+                        TOOCON 是由 GDG 高雄主辦，堅持大順路以南的中小型軟體相關交流聚會，
+                        因為活動跟二有關連，而且都在晚上舉辦，所以用 TWO 的諧音 TOO，於是中文名稱就叫「天黑黑月會」。
+                        TOOCON 從最初的 8 人到現在的穩定 30 人，分享怎麼從無到有建立 TOOCON 天黑黑月會。
+                    `,
+            },
+            {
+                id: '10',
+                name: '劉倚成',
+                type: TypeTranslationZhHant[community],
+                community: '高雄敏捷',
+                topics: ['社群經營', '經驗分享', '社群活動'],
+                title: '在地敏捷社群的力量——從團隊到社會的影響',
+                summary:
+                    '介紹敏捷社群的沿革、講者和參與者的多元性與互動性，回顧敏捷社群活動的成就與挑戰，分享社群未來的展望及目標',
+            },
+            {
+                id: '11',
+                name: 'Saurav Jain',
+                type: TypeTranslationZhHant[professional],
+                community: '',
+                topics: ['資料萃取'],
+                title: 'Smart Proxy Management in Python: Extract Data Efficiently',
+                summary:
+                    'Efficient web scraping requires overcoming challenges like IP blocking and rate limiting. This poster session explores smart proxy management using Crawlee.',
+            },
+            {
+                id: '12',
+                name: '蔡嘉平',
+                type: TypeTranslationZhHant[community],
+                community: 'Apache 基金會 & 源來適你',
+                topics: ['社群經營', '經驗分享', '社群活動'],
+                title: '從台灣走向國際、從源來適你走向開源',
+                summary: `
+                    參與開源貢獻已經是軟體工程師提昇自我的一個常見道路，
+                    台灣正處與新技術的黃金時代，身為台灣軟體工程師我們更不應該在開源這條道路上掉隊。
+                    本次分享我們將著重在開源技術的介紹、對自我價值的回饋、以及一些成功案例的分享。
+                    此外也會分享「源來適你」如何在這條路上陪伴大家「源來適你」網站：https://www.facebook.com/opensource4you
+                `,
+            },
+            {
+                id: '13',
+                name: 'Calvin TSANG',
+                type: TypeTranslationZhHant[community],
+                community: 'PyCon Hong Kong',
+                topics: ['社群經營', '經驗分享'],
+                title: 'Pycon HK',
+                summary: '主要介紹 pycon Hong Kong 2024事宜',
+            },
+            {
+                id: '14',
+                name: 'Ivy Fung',
+                type: TypeTranslationZhHant[community],
+                community: 'PyCon MY',
+                topics: ['社群經營', '人際溝通', '經驗分享'],
+                title: 'Sustainable Community 可持续社区',
+                summary: `
+                    新冠肆虐给 PyCon MY 带来重创。
+                    社区剩下人数寥寥无几，经费来源也受影响。
+                    主要干部倍感危机，开始寻找让社团可持续的方向。
+                    这是个还在进行的方案，无法给出成果。
+                    目標聚集在以下四點：
+                        1. 社區人數
+                        2. 經費
+                        3. 與其他社區、業界和政府機關的合作
+                        4. 接班人
+                `,
+            },
+            {
+                id: '15',
+                name: 'John Lu',
+                type: TypeTranslationZhHant[professional],
+                community: '',
+                topics: ['人工智慧'],
+                title: 'Finetune Large Language Models with LoRA using KerasNLP',
+                summary:
+                    'Finetuning LLMs allows us to customize the model for our application. This poster shows how fine-tuning LLMs could be done in a parameter-efficient way with KerasNLP and LoRA.',
+            },
+        ],
+    },
+})
diff --git a/i18n/speaking/poster-session.i18n.js b/i18n/speaking/cfp-poster.i18n.js
similarity index 86%
rename from i18n/speaking/poster-session.i18n.js
rename to i18n/speaking/cfp-poster.i18n.js
index e15115346c..e5fcc79a4b 100644
--- a/i18n/speaking/poster-session.i18n.js
+++ b/i18n/speaking/cfp-poster.i18n.js
@@ -61,17 +61,17 @@ export default genI18nMessages({
         },
     },
     'zh-hant': {
-        title: 'Poster Session 稿件募集',
+        title: '如何投稿海報',
         intro: [
-            'Poster Session 是一個讓投稿者可以透過海報展示其分享內容，並與個別與會者直接互動的一種展示形式。在 PyCon Taiwan 2024 我們初次嘗試 Poster Session 的活動，希望可以讓更多人介紹自己的成果或是關注的議題。您可以投稿任何跟 Python 有關的主題，屆時將以海報形式展出，然後與會者可與您直接互動。',
+            '海報環節是一個讓投稿者可以透過海報展示其分享內容，並與個別與會者直接互動的一種展示形式。在 PyCon Taiwan 2024 我們初次嘗試海報募集的活動，希望可以讓更多人介紹自己的成果或是關注的議題。您可以投稿任何跟 Python 有關的主題，屆時將以海報形式展出，然後與會者可與您直接互動。',
         ],
         info: {
             importantDates: {
                 title: '重要日期',
                 description: [
                     '大會日期： 9/21 - 9/22',
-                    'Poster 開放徵稿：2024 年 05 月 01 日',
-                    'Poster 徵稿截止：2024 年 06 月 30 日 23:59:59 ({aoe})',
+                    '海報開放徵稿：2024 年 05 月 01 日',
+                    '海報徵稿截止：2024 年 06 月 30 日 23:59:59 ({aoe})',
                     '稿件錄取通知：2024 年 07 月 13 日',
                 ],
                 steps: [],
@@ -80,7 +80,7 @@ export default genI18nMessages({
             howToSubmit: {
                 title: '提交稿件',
                 description: [
-                    '請您前往 {posterForm} 進行投稿，提供 Poster 的主題、摘要、內容說明，以及填妥您的個人資訊。',
+                    '請您前往 {posterForm} 進行投稿，提供海報的主題、摘要、內容說明，以及填妥您的個人資訊。',
                     '背板尺寸 900mm x 1800mm，在上述尺寸內允許多張海報',
                 ],
                 steps: [],
@@ -111,12 +111,12 @@ export default genI18nMessages({
         terms: {
             aoe: 'AoE',
             coc: '行為準則',
-            posterForm: 'Poster Session 投稿表單',
+            posterForm: '海報投稿表單',
         },
 
         og: {
-            title: 'Poster Session 稿件募集',
-            description: '首先，謝謝您考慮投稿 Poster 至 PyCon Taiwan 2024。',
+            title: '海報稿件募集',
+            description: '首先，謝謝您考慮投稿海報至 PyCon Taiwan 2024。',
         },
     },
 })
diff --git a/pages/conference/_components/modal/Modal.vue b/pages/conference/_components/modal/Modal.vue
new file mode 100644
index 0000000000..1fc796de40
--- /dev/null
+++ b/pages/conference/_components/modal/Modal.vue
@@ -0,0 +1,44 @@
+<template>
+    <div
+        v-show="shouldShowModal"
+        class="fixed left-0 top-0 z-[9998] flex h-screen w-full items-center justify-center bg-[rgba(18,16,35,0.6)] backdrop-blur-[5px]"
+    >
+        <div class="absolute z-[9999] h-full w-full" @click="close"></div>
+        <div
+            class="relative z-[10000] flex w-11/12 flex-col rounded-3xl border-3 border-pink-500 bg-black-900 px-4 py-5 md:w-4/5 md:max-w-2xl md:border-2 md:px-12 md:pb-6 md:pt-14"
+        >
+            <div
+                class="absolute right-[17px] top-[17px] ml-auto flex cursor-pointer text-pink-500 md:right-[38.5px] md:top-[39.25px]"
+                @click="close"
+            >
+                <fa icon="times" class="h-5 w-5" />
+            </div>
+            <slot></slot>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'Modal',
+    props: {
+        value: { type: Boolean, default: false },
+    },
+    data() {
+        return {
+            shouldShowModal: this.value,
+        }
+    },
+    watch: {
+        value(newVal) {
+            this.shouldShowModal = newVal
+        },
+    },
+    methods: {
+        close() {
+            this.shouldShowModal = false
+            this.$emit('input', false)
+        },
+    },
+}
+</script>
diff --git a/pages/conference/_eventType/index.vue b/pages/conference/_eventType/index.vue
index 609c7e6d6e..16d1e0aa4e 100644
--- a/pages/conference/_eventType/index.vue
+++ b/pages/conference/_eventType/index.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="lg:py24 py-10 md:py-24">
+    <div class="py-10 md:py-24">
         <banner>
             <core-h1 :title="title"></core-h1>
             <p class="leading-6">
diff --git a/pages/conference/poster-session.vue b/pages/conference/poster-session.vue
new file mode 100644
index 0000000000..c1accee2fd
--- /dev/null
+++ b/pages/conference/poster-session.vue
@@ -0,0 +1,161 @@
+<!-- eslint-disable vue/no-v-html -->
+<template>
+    <div class="poster-session">
+        <banner>
+            <core-h1 :title="$t('title')"></core-h1>
+            <i18n path="intro" tag="p" class="intro">
+                <template #br><br /></template>
+            </i18n>
+        </banner>
+        <i18n-page-wrapper class="px-2 sm:px-8 md:px-16 lg:px-32" custom-x>
+            <div class="poster-session__container">
+                <article
+                    v-for="poster in $t('posters')"
+                    :id="poster.id"
+                    :key="poster.id"
+                    class="poster-session__card"
+                    @click="showModal(poster)"
+                >
+                    <div class="mb-6 text-right text-xs">
+                        {{ poster.type }}
+                    </div>
+                    <div
+                        class="line-clamp-5 five-line-height mb-6 text-[#CDCBFF]"
+                    >
+                        {{ poster.title }}
+                    </div>
+                    <div
+                        class="mb-2 flex flex-wrap gap-x-1 text-xs text-[#BB75BC]"
+                    >
+                        <span>
+                            {{ poster.name }}
+                        </span>
+                        <span>
+                            {{
+                                `${poster.community && '|'} ${poster.community}`
+                            }}
+                        </span>
+                    </div>
+                    <div
+                        class="flex flex-1 flex-col items-start justify-end gap-y-1 text-center text-[10px]"
+                    >
+                        <span
+                            v-for="topic in poster.topics"
+                            :id="topic"
+                            :key="topic"
+                            class="rounded-md bg-[#BB75BC] p-1 text-[#000]"
+                        >
+                            {{ topic }}
+                        </span>
+                    </div>
+                </article>
+            </div>
+        </i18n-page-wrapper>
+        <transition name="fade">
+            <modal v-if="isOpened" v-model="isOpened">
+                <div class="flex flex-col items-center space-y-3 p-2">
+                    <div class="text-xl text-[#CDCBFF]">
+                        {{ selectedPoster.title }}
+                    </div>
+                    <div class="text-center text-sm">
+                        <div class="text-[#BB75BC]">
+                            {{ selectedPoster.name }}
+                        </div>
+                        <div class="text-[#BB75BC]">
+                            {{ selectedPoster.community }}
+                        </div>
+                    </div>
+
+                    <div
+                        v-html="$md.render(selectedPoster.summary.trim())"
+                    ></div>
+                </div>
+            </modal>
+        </transition>
+    </div>
+</template>
+<script>
+import I18nPageWrapper from '@/components/core/i18n/PageWrapper'
+import i18n from '@/i18n/conference/poster-session.i18n'
+import Banner from '@/components/core/layout/Banner'
+import CoreH1 from '@/components/core/titles/H1'
+import Modal from './_components/modal/Modal'
+
+export default {
+    i18n,
+    name: 'PageConferencePosterSession',
+    components: {
+        Banner,
+        CoreH1,
+        I18nPageWrapper,
+        Modal,
+    },
+    data() {
+        return {
+            isOpened: false,
+            selectedPoster: {
+                id: '1',
+                name: 'KK',
+                type: '社群講',
+                community: '台灣數位遊牧者社群',
+                topics: ['社群經營', '人際溝通', '經驗分享'],
+                title: '第一次當總召的我，竟然想在第一屆就辦三百人的年會',
+                summary:
+                    '分享如何舉辦第一屆的三百人年會，包含志工招募、遇到問題與解決方式、大變動等等',
+            },
+        }
+    },
+    methods: {
+        showModal(poster) {
+            this.isOpened = true
+            this.selectedPoster = poster
+        },
+    },
+}
+</script>
+
+<style lang="postcss">
+p.description {
+    text-align: unset;
+}
+
+.poster-session__container {
+    display: grid;
+    justify-content: center;
+    gap: 8px;
+    grid-template-columns: repeat(auto-fit, 239px);
+}
+
+.poster-session {
+    @apply py-10 md:py-24;
+
+    .five-line-height {
+        line-height: 1.5em;
+        height: calc(5 * 1.5em);
+        overflow: hidden;
+    }
+}
+
+.poster-session__card {
+    @apply flex cursor-pointer flex-col rounded-3xl bg-[#1f1c3b] p-6;
+    border: 1px solid transparent;
+
+    &:hover {
+        @apply bg-primary-800;
+        border: 1px solid #746bb8;
+        box-shadow: 0px 0px 10px 10px #352d66;
+
+        & .title {
+            @apply text-pink-700;
+        }
+        & .cardTxt {
+            @apply text-primary-100;
+        }
+    }
+}
+
+.poster-session .summary-link {
+    text-decoration: underline;
+    color: #da8bdc;
+}
+</style>
diff --git a/pages/speaking/poster-session.vue b/pages/speaking/cfp-poster.vue
similarity index 99%
rename from pages/speaking/poster-session.vue
rename to pages/speaking/cfp-poster.vue
index a87c7c83ca..42887ac6c7 100644
--- a/pages/speaking/poster-session.vue
+++ b/pages/speaking/cfp-poster.vue
@@ -67,7 +67,7 @@ import CoreH1 from '@/components/core/titles/H1'
 import TwoColWrapper from '@/components/core/layout/TwoColWrapper'
 import LocaleLink from '@/components/core/links/LocaleLink.vue'
 import ExtLink from '@/components/core/links/ExtLink.vue'
-import i18n from '@/i18n/speaking/poster-session.i18n'
+import i18n from '@/i18n/speaking/cfp-poster.i18n'
 
 export default {
     i18n,