<!DOCTYPE html><html lang="yue" class="scroll-smooth"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="icon" type="image/svg+xml" href="/logo.svg"><meta name="generator" content="Astro v6.3.1"><title>粵拼 Jyutping – 粵語拼音方案</title><meta name="description" content="標準粵語拼音方案 Standard Cantonese Romanization Scheme"><meta name="keywords" content="Jyutping, 粵拼, Cantonese, Romanization, language, learning, transcription, input method, cantonese keyboard, jyutping input method, jyutping keyboard"><meta property="og:type" content="website"><meta property="og:url" content="https://jyutping.org"><meta property="og:title" content="粵拼 Jyutping – 粵語拼音方案"><meta property="og:description" content="標準粵語拼音方案 Standard Cantonese Romanization Scheme"><meta property="twitter:url" content="https://jyutping.org"><meta property="twitter:title" content="粵拼 Jyutping – 粵語拼音方案"><meta property="twitter:description" content="標準粵語拼音方案 Standard Cantonese Romanization Scheme"><link rel="alternate" hreflang="en" href="https://jyutping.org/en"><link rel="alternate" hreflang="vi" href="https://jyutping.org/vi"><link rel="alternate" hreflang="yue" href="https://jyutping.org/"><link rel="alternate" hreflang="cmn" href="https://jyutping.org/cmn"><link rel="alternate" hreflang="nan" href="https://jyutping.org/nan"><link rel="alternate" hreflang="wuu" href="https://jyutping.org/wuu"><link rel="alternate" hreflang="yue-hans" href="https://jyutping.org/yue_hans"><link rel="alternate" hreflang="ja" href="https://jyutping.org/ja"><link rel="alternate" hreflang="x-default" href="https://jyutping.org/"><style>@font-face{font-family:"Chiron Hei HK WS-0a3b523472c2107a";src:url("/_astro/fonts/ed627aacdfed8ae7.woff2") format("woff2");font-display:swap;font-weight:100 900;font-style:normal;}@font-face{font-family:"Chiron Hei HK WS-0a3b523472c2107a fallback: Arial";src:local("Arial");font-display:swap;font-weight:100 900;font-style:normal;size-adjust:97.3529%;ascent-override:119.1541%;descent-override:29.5831%;line-gap-override:0%;}:root{--font-chiron-hei-hk-ws:"Chiron Hei HK WS-0a3b523472c2107a","Chiron Hei HK WS-0a3b523472c2107a fallback: Arial",sans-serif;}</style><link rel="preload" href="/_astro/fonts/ed627aacdfed8ae7.woff2" as="font" type="font/woff2" crossorigin><style>@font-face{font-family:"Chiron Hei HK Jyutping-f6875e094e31ee71";src:url("/_astro/fonts/2a6842192c69ff2d.woff2") format("woff2");font-display:swap;font-weight:normal;font-style:normal;}@font-face{font-family:"Chiron Hei HK Jyutping-f6875e094e31ee71 fallback: Arial";src:local("Arial");font-display:swap;font-weight:normal;font-style:normal;size-adjust:222.2966%;ascent-override:52.1825%;descent-override:12.9557%;line-gap-override:0%;}:root{--font-chiron-hei-hk-jyutping:"Chiron Hei HK Jyutping-f6875e094e31ee71","Chiron Hei HK Jyutping-f6875e094e31ee71 fallback: Arial",sans-serif;}</style><link rel="preload" href="/_astro/fonts/2a6842192c69ff2d.woff2" as="font" type="font/woff2" crossorigin><script defer src="https://cloud.umami.is/script.js" data-website-id="188fdd26-8e55-42b6-ba73-7d2f58adca11"></script><meta name="astro-view-transitions-enabled" content="true"><meta name="astro-view-transitions-fallback" content="animate"><script type="module" src="/_astro/ClientRouter.astro_astro_type_script_index_0_lang.CAqDO0tx.js"></script><meta http-equiv="content-security-policy" content="base-uri 'self';connect-src 'self' https://cloud.umami.is https://*.umami.is;default-src 'self';font-src 'self';frame-src 'self' https://www.youtube.com https://youtube.com;img-src 'self' data:;media-src 'self';object-src 'none'; script-src 'self' https://cloud.umami.is 'sha256-TUp1ibtGj7we/lwPxDcEFBK3NVf2aqakf+uE6VcssWM=' 'sha256-BF0290pkb3jxQsE7z00xR8Imp8X34FLC88L0lkMnrGw=' 'sha256-QzWFZi+FLIx23tnm9SBU4aEgx4x8DsuASP07mfqol/c=' 'sha256-0chmwFk0zaA528yFfGV7J9ppIpdfTPPULncDF3WG7Zs=' 'sha256-eIXWvAmxkr251LJZkjniEK5LcPF3NkapbJepohwYRIc=' 'sha256-Q2BPg90ZMplYY+FSdApNErhpWafg2hcRRbndmvxuL/Q=' 'sha256-SaCkFfPruIdTXT8/97JArQmGxiJAL2o4bBDvSgJ5y3Q=' 'sha256-QPkXvDKqq1ylJV2yCZkuBiSK2bEMKkpV0oN18JSfREA='; style-src 'self' 'sha256-RHT/TI7iCbjuD+5HV63T4k1hHoHmGMsO6OHYfsIfPuA=' 'sha256-OB9kn93FqrQjP5l294d1sQS3CJbuGglFkXUBZ+OewDQ=' 'sha256-1BIVsKH9B89xoFV4kpaPIhFh4WSsdkPTUwYkOetFJnU=' 'sha256-vv9IoKo7BSLbWcUHr3tNmfNVmm5L/9Cfn2H6LMk7/ow=' 'sha256-47DEQpj8HBSa+/TImW+5JCeuQeRkm5NMpJWZG3hSuFU=';"><link rel="stylesheet" href="/_astro/BaseLayout.D9qxfyqG.css"></head> <body class="antialiased bg-white text-gray-800 flex flex-col min-h-screen"> <div id="mobile-menu-backdrop" class="fixed inset-0 z-40 bg-black/50 md:hidden opacity-0 pointer-events-none transition-opacity duration-300"></div> <header class="z-50 p-4 text-white absolute inset-x-0 top-0 bg-transparent"> <div class="flex justify-between items-center px-4"> <a href="/" class="text-white hover:opacity-80"> <span class="text-3xl font-jyutping">粵拼</span> </a>  <nav class="hidden md:flex space-x-12"> <a href="/learn" class="text-white text-lg hover:opacity-90"> 學粵拼 </a><a href="/jyutping" class="text-white text-lg hover:opacity-90"> 粵拼方案 </a><a href="/blog" class="text-white text-lg hover:opacity-90"> 文章 </a><a href="/keyboard" class="text-white text-lg hover:opacity-90"> 資源 </a><a href="/about" class="text-white text-lg hover:opacity-90"> 關於 </a> </nav>  <div class="hidden md:block"> <style>astro-island,astro-slot,astro-static-slot{display:contents}</style><script>(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).load=e;window.dispatchEvent(new Event("astro:load"));})();</script><script>(()=>{var g=Object.defineProperty;var w=(c,s,d)=>s in c?g(c,s,{enumerable:!0,configurable:!0,writable:!0,value:d}):c[s]=d;var l=(c,s,d)=>w(c,typeof s!="symbol"?s+"":s,d);var E=new Set(["__proto__","constructor","prototype"]);{let c={0:t=>y(t),1:t=>d(t),2:t=>new RegExp(t),3:t=>new Date(t),4:t=>new Map(d(t)),5:t=>new Set(d(t)),6:t=>BigInt(t),7:t=>new URL(t),8:t=>new Uint8Array(t),9:t=>new Uint16Array(t),10:t=>new Uint32Array(t),11:t=>Number.POSITIVE_INFINITY*t},s=t=>{let[p,e]=t;return p in c?c[p](e):void 0},d=t=>t.map(s),y=t=>typeof t!="object"||t===null?t:Object.fromEntries(Object.entries(t).map(([p,e])=>[p,s(e)]));class f extends HTMLElement{constructor(){super(...arguments);l(this,"Component");l(this,"hydrator");l(this,"hydrate",async()=>{var b;if(!this.hydrator||!this.isConnected)return;let e=(b=this.parentElement)==null?void 0:b.closest("astro-island[ssr]");if(e){e.addEventListener("astro:hydrate",this.hydrate,{once:!0});return}let n=this.querySelectorAll("astro-slot"),r={},i=this.querySelectorAll("template[data-astro-template]");for(let o of i){let a=o.closest(this.tagName);a!=null&&a.isSameNode(this)&&(r[o.getAttribute("data-astro-template")||"default"]=o.innerHTML,o.remove())}for(let o of n){let a=o.closest(this.tagName);a!=null&&a.isSameNode(this)&&(r[o.getAttribute("name")||"default"]=o.innerHTML)}let u;try{u=this.hasAttribute("props")?y(JSON.parse(this.getAttribute("props"))):{}}catch(o){let a=this.getAttribute("component-url")||"<unknown>",v=this.getAttribute("component-export");throw v&&(a+=` (export ${v})`),console.error(`[hydrate] Error parsing props for component ${a}`,this.getAttribute("props"),o),o}let h;await this.hydrator(this)(this.Component,u,r,{client:this.getAttribute("client")}),this.removeAttribute("ssr"),this.dispatchEvent(new CustomEvent("astro:hydrate"))});l(this,"unmount",()=>{this.isConnected||this.dispatchEvent(new CustomEvent("astro:unmount"))})}disconnectedCallback(){document.removeEventListener("astro:after-swap",this.unmount),document.addEventListener("astro:after-swap",this.unmount,{once:!0})}connectedCallback(){if(!this.hasAttribute("await-children")||document.readyState==="interactive"||document.readyState==="complete")this.childrenConnectedCallback();else{let e=()=>{document.removeEventListener("DOMContentLoaded",e),n.disconnect(),this.childrenConnectedCallback()},n=new MutationObserver(()=>{var r;((r=this.lastChild)==null?void 0:r.nodeType)===Node.COMMENT_NODE&&this.lastChild.nodeValue==="astro:end"&&(this.lastChild.remove(),e())});n.observe(this,{childList:!0}),document.addEventListener("DOMContentLoaded",e)}}async childrenConnectedCallback(){let e=this.getAttribute("before-hydration-url");e&&await import(e),this.start()}getRetryImportUrl(e){let n=new URL(e,document.baseURI),r=`astro-retry=${Date.now()}`,i=n.hash.replace(/^#/,"");return n.hash=i?`${i}&${r}`:r,n.toString()}async importWithRetry(e){try{return await import(e)}catch(n){return await new Promise(r=>setTimeout(r,1e3)),import(this.getRetryImportUrl(e))}}handleHydrationError(e){let n=this.getAttribute("component-url"),r=new CustomEvent("astro:hydration-error",{cancelable:!0,bubbles:!0,composed:!0,detail:{error:e,componentUrl:n}});this.dispatchEvent(r)&&console.error(`[astro-island] Error hydrating ${n}`,e)}async start(){let e=JSON.parse(this.getAttribute("opts")),n=this.getAttribute("client");if(Astro[n]===void 0){window.addEventListener(`astro:${n}`,()=>this.start(),{once:!0});return}try{await Astro[n](async()=>{let r=this.getAttribute("renderer-url");try{let[i,{default:u}]=await Promise.all([this.importWithRetry(this.getAttribute("component-url")),r?this.importWithRetry(r):Promise.resolve({default:()=>()=>{}})]),h=this.getAttribute("component-export")||"default";if(h.includes(".")){this.Component=i;for(let m of h.split(".")){if(E.has(m)||!this.Component||typeof this.Component!="object"&&typeof this.Component!="function"||!Object.hasOwn(this.Component,m))throw new Error(`Invalid component export path: ${h}`);this.Component=this.Component[m]}}else{if(E.has(h))throw new Error(`Invalid component export path: ${h}`);this.Component=i[h]}return this.hydrator=u,this.hydrate}catch(i){return this.handleHydrationError(i),()=>{}}},e,this)}catch(r){this.handleHydrationError(r)}}attributeChangedCallback(){this.hydrate()}}l(f,"observedAttributes",["props"]),customElements.get("astro-island")||customElements.define("astro-island",f)}})();</script><astro-island uid="Z1F4Lmr" prefix="r20" component-url="/_astro/LanguageSwitcher.DaQJb2KA.js" component-export="default" renderer-url="/_astro/client.mxV3x1Xx.js" props="{&quot;currentPathname&quot;:[0,&quot;/&quot;]}" ssr client="load" opts="{&quot;name&quot;:&quot;LanguageSwitcher&quot;,&quot;value&quot;:true}" await-children><div class="flex"><div class="relative"><button type="button" aria-expanded="false" aria-haspopup="listbox" class="flex items-center gap-1.5 text-white opacity-80 hover:opacity-100 transition-opacity"><svg xmlns="http://www.w3.org/2000/svg" width="1.125rem" height="1.125rem" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-world "><path d="M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0"></path><path d="M3.6 9h16.8"></path><path d="M3.6 15h16.8"></path><path d="M11.5 3a17 17 0 0 0 0 18"></path><path d="M12.5 3a17 17 0 0 1 0 18"></path></svg><span lang="yue" class="mb-px">粵語</span><svg xmlns="http://www.w3.org/2000/svg" width="1rem" height="1rem" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-down "><path d="M6 9l6 6l6 -6"></path></svg></button><div class="md:absolute md:right-0 mt-2 z-50 bg-white text-gray-800 rounded shadow-lg min-w-max grid grid-rows-[0fr] transition-[grid-template-rows] duration-300"><div class="overflow-hidden"><ul role="listbox" aria-label="Select language" class="py-1"><li role="option" aria-selected="false"><a href="/en" lang="en" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors ">English</a></li><li role="option" aria-selected="false"><a href="/vi" lang="vi" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors ">Tiếng Việt</a></li><li role="option" aria-selected="true"><a href="/" lang="yue" aria-current="page" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors font-semibold">粵語</a></li><li role="option" aria-selected="false"><a href="/cmn" lang="cmn" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors ">普通话/國語</a></li><li role="option" aria-selected="false"><a href="/nan" lang="nan" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors ">臺灣閩南語</a></li><li role="option" aria-selected="false"><a href="/wuu" lang="wuu" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors ">吳語</a></li><li role="option" aria-selected="false"><a href="/yue_hans" lang="yue-hans" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors ">粤语简体</a></li><li role="option" aria-selected="false"><a href="/ja" lang="ja" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors ">日本語</a></li></ul></div></div></div></div><!--astro:end--></astro-island> </div>  <button type="button" class="md:hidden text-white cursor-pointer" aria-label="Toggle menu" id="mobile-menu-button"> <svg xmlns="http://www.w3.org/2000/svg" width="1.5rem" height="1.5rem" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-menu-2 "><path d="M4 6l16 0"></path><path d="M4 12l16 0"></path><path d="M4 18l16 0"></path></svg> </button>  <div id="mobile-menu-panel" class="bg-[#1678d3] text-white absolute top-full left-0 right-0 z-50 [.open]:shadow-md md:hidden max-md:grid max-md:grid-rows-[0fr] max-md:transition-[grid-template-rows] max-md:duration-300 max-md:[.open]:grid-rows-[1fr]"> <div class="overflow-hidden"> <div class="px-8 py-4 flex flex-col space-y-4">  <nav class="flex flex-col space-y-2"> <a href="/learn" class="text-white text-lg hover:opacity-80"> 學粵拼 </a><a href="/jyutping" class="text-white text-lg hover:opacity-80"> 粵拼方案 </a><a href="/blog" class="text-white text-lg hover:opacity-80"> 文章 </a><a href="/keyboard" class="text-white text-lg hover:opacity-80"> 資源 </a><a href="/about" class="text-white text-lg hover:opacity-80"> 關於 </a> </nav>  <astro-island uid="Z1F4Lmr" prefix="r21" component-url="/_astro/LanguageSwitcher.DaQJb2KA.js" component-export="default" renderer-url="/_astro/client.mxV3x1Xx.js" props="{&quot;currentPathname&quot;:[0,&quot;/&quot;]}" ssr client="load" opts="{&quot;name&quot;:&quot;LanguageSwitcher&quot;,&quot;value&quot;:true}" await-children><div class="flex"><div class="relative"><button type="button" aria-expanded="false" aria-haspopup="listbox" class="flex items-center gap-1.5 text-white opacity-80 hover:opacity-100 transition-opacity"><svg xmlns="http://www.w3.org/2000/svg" width="1.125rem" height="1.125rem" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-world "><path d="M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0"></path><path d="M3.6 9h16.8"></path><path d="M3.6 15h16.8"></path><path d="M11.5 3a17 17 0 0 0 0 18"></path><path d="M12.5 3a17 17 0 0 1 0 18"></path></svg><span lang="yue" class="mb-px">粵語</span><svg xmlns="http://www.w3.org/2000/svg" width="1rem" height="1rem" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-down "><path d="M6 9l6 6l6 -6"></path></svg></button><div class="md:absolute md:right-0 mt-2 z-50 bg-white text-gray-800 rounded shadow-lg min-w-max grid grid-rows-[0fr] transition-[grid-template-rows] duration-300"><div class="overflow-hidden"><ul role="listbox" aria-label="Select language" class="py-1"><li role="option" aria-selected="false"><a href="/en" lang="en" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors ">English</a></li><li role="option" aria-selected="false"><a href="/vi" lang="vi" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors ">Tiếng Việt</a></li><li role="option" aria-selected="true"><a href="/" lang="yue" aria-current="page" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors font-semibold">粵語</a></li><li role="option" aria-selected="false"><a href="/cmn" lang="cmn" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors ">普通话/國語</a></li><li role="option" aria-selected="false"><a href="/nan" lang="nan" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors ">臺灣閩南語</a></li><li role="option" aria-selected="false"><a href="/wuu" lang="wuu" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors ">吳語</a></li><li role="option" aria-selected="false"><a href="/yue_hans" lang="yue-hans" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors ">粤语简体</a></li><li role="option" aria-selected="false"><a href="/ja" lang="ja" class="block px-4 py-1.5 hover:bg-gray-200 transition-colors ">日本語</a></li></ul></div></div></div></div><!--astro:end--></astro-island> </div> </div> </div> </div> </header> <script type="module">function a(){const n=document.getElementById("mobile-menu-button"),o=document.getElementById("mobile-menu-panel"),t=document.getElementById("mobile-menu-backdrop");if(n&&o&&t){const s=()=>{o.classList.remove("open"),t.classList.add("opacity-0","pointer-events-none")},d=()=>{const e=o.classList.toggle("open");t.classList.toggle("opacity-0",!e),t.classList.toggle("pointer-events-none",!e)},c=n.cloneNode(!0);if(n.parentNode)n.parentNode.replaceChild(c,n);else{console.error("Menu button has no parent node.");return}c.addEventListener("click",d),t.addEventListener("click",s),o.querySelectorAll("a").forEach(e=>{const l=e.cloneNode(!0);if(e.parentNode)e.parentNode.replaceChild(l,e);else{console.warn("Menu link has no parent node during setup."),e.addEventListener("click",s);return}l.addEventListener("click",s)})}else console.log("Mobile menu button or panel not found after page load.")}a();document.addEventListener("astro:page-load",a);</script> <main class="flex-grow">  <section class="bg-[#1678d3] text-white"> <div class="mx-auto max-w-5xl px-6 pb-20 pt-32 text-center md:pb-28 md:pt-40"> <div class="flex flex-col items-center"> <h1 class="font-jyutping text-7xl leading-none tracking-wide drop-shadow-[0_8px_24px_rgba(0,0,0,0.25)] md:text-9xl">
粵拼
</h1> </div> <div class="mt-10 space-y-2"> <p class="font-jyutping text-2xl leading-relaxed font-medium text-white/95 md:text-4xl"> 簡單合理 易學易用 </p><p class="font-jyutping text-2xl leading-relaxed font-medium text-white/95 md:text-4xl"> 通行粵語拼音方案 </p> </div> <div class="mt-12 flex flex-col items-center justify-center gap-4 sm:flex-row"> <a href="/learn" class="inline-flex items-center gap-2 rounded-full bg-yellow-300 px-8 py-4 text-lg font-semibold text-neutral-900 shadow-[0_12px_32px_-12px_rgba(0,0,0,0.5)] transition-all hover:-translate-y-0.5 hover:bg-yellow-400 active:translate-y-0"> 一文掌握粵拼 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-vocabulary h-5 w-5"><path d="M10 19h-6a1 1 0 0 1 -1 -1v-14a1 1 0 0 1 1 -1h6a2 2 0 0 1 2 2a2 2 0 0 1 2 -2h6a1 1 0 0 1 1 1v14a1 1 0 0 1 -1 1h-6a2 2 0 0 0 -2 2a2 2 0 0 0 -2 -2"></path><path d="M12 5v16"></path><path d="M7 7h1"></path><path d="M7 11h1"></path><path d="M16 7h1"></path><path d="M16 11h1"></path><path d="M16 15h1"></path></svg> </a> <a href="/keyboard" class="inline-flex items-center gap-2 rounded-full border-2 border-white/60 bg-white/10 px-8 py-4 text-lg font-semibold text-white backdrop-blur-sm transition-colors hover:border-white hover:bg-white/20"> 試下粵拼輸入法 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-keyboard h-5 w-5"><path d="M2 8a2 2 0 0 1 2 -2h16a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-16a2 2 0 0 1 -2 -2l0 -8"></path><path d="M6 10l0 .01"></path><path d="M10 10l0 .01"></path><path d="M14 10l0 .01"></path><path d="M18 10l0 .01"></path><path d="M6 14l0 .01"></path><path d="M18 14l0 .01"></path><path d="M10 14l4 .01"></path></svg> </a> </div> <div class="mt-16 flex justify-center text-white/50"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-down h-6 w-6 motion-safe:animate-bounce"><path d="M12 5l0 14"></path><path d="M18 13l-6 6"></path><path d="M6 13l6 6"></path></svg> </div> </div> </section> <section class="bg-neutral-50 text-neutral-900"> <div class="mx-auto max-w-6xl px-6 py-20 md:py-24"> <div class="grid grid-cols-1 items-center gap-12 lg:grid-cols-2 lg:gap-16"> <div> <div class="mb-5 inline-flex items-center gap-2 rounded-full bg-[#1678d3]/10 px-3 py-1 text-sm font-semibold text-[#1678d3]"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-sparkles h-4 w-4"><path d="M16 18a2 2 0 0 1 2 2a2 2 0 0 1 2 -2a2 2 0 0 1 -2 -2a2 2 0 0 1 -2 2m0 -12a2 2 0 0 1 2 2a2 2 0 0 1 2 -2a2 2 0 0 1 -2 -2a2 2 0 0 1 -2 2m-7 12a6 6 0 0 1 6 -6a6 6 0 0 1 -6 -6a6 6 0 0 1 -6 6a6 6 0 0 1 6 6"></path></svg> 粵拼係乜？ </div> <div class="font-jyutping space-y-4 text-xl leading-relaxed text-neutral-800 md:text-2xl"> <p>粵拼係粵語嘅標準拼音方案</p> </div> </div> <div class="rounded-3xl bg-white p-8 shadow-xl shadow-neutral-900/5 ring-1 ring-[#1678d3] md:p-10"> <div class="space-y-4"> <div> <p class="font-jyutping text-3xl font-medium text-[#1678d3] md:text-4xl">
粵語拼音
</p> </div> <div> <p class="inline-flex items-center gap-3 text-xl md:text-3xl text-[#1678d3]"> <span class="">ping3 jam1</span> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-right "><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg> <span class="">拼音</span> </p> </div> </div> </div> </div> </div> </section> <section class="bg-[#1678d3] text-white"> <div class="mx-auto max-w-6xl px-6 py-20 md:py-24"> <h2 class="mb-4 text-center text-3xl font-bold md:text-5xl"> 點解要學粵拼？ </h2> <div class="mx-auto mb-14 h-1 w-16 rounded-full bg-yellow-300"></div> <div class="grid grid-cols-1 gap-6 md:grid-cols-3"> <div class="rounded-3xl bg-white/10 p-8 ring-1 ring-white/15 backdrop-blur-sm transition-all hover:-translate-y-1 hover:bg-white/15"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-ear mb-6 h-12 w-12 text-yellow-300"><path d="M6 10a7 7 0 1 1 13 3.6a10 10 0 0 1 -2 2a8 8 0 0 0 -2 3a4.5 4.5 0 0 1 -6.8 1.4"></path><path d="M10 10a3 3 0 1 1 5 2.2"></path></svg> <p class="text-xl leading-relaxed text-white/95">學識粵拼可以幫助糾正懶音錯音，規範自己嘅粵語發音。</p> </div><div class="rounded-3xl bg-white/10 p-8 ring-1 ring-white/15 backdrop-blur-sm transition-all hover:-translate-y-1 hover:bg-white/15"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-language mb-6 h-12 w-12 text-[#CBF2AE]"><path d="M9 6.371c0 4.418 -2.239 6.629 -5 6.629"></path><path d="M4 6.371h7"></path><path d="M5 9c0 2.144 2.252 3.908 6 4"></path><path d="M12 20l4 -9l4 9"></path><path d="M19.1 18h-6.2"></path><path d="M6.694 3l.793 .582"></path></svg> <p class="text-xl leading-relaxed text-white/95">漢字非拼音文字，學識粵拼即可快速學識粵語發音</p> </div><div class="rounded-3xl bg-white/10 p-8 ring-1 ring-white/15 backdrop-blur-sm transition-all hover:-translate-y-1 hover:bg-white/15"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-keyboard mb-6 h-12 w-12 text-white"><path d="M2 8a2 2 0 0 1 2 -2h16a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-16a2 2 0 0 1 -2 -2l0 -8"></path><path d="M6 10l0 .01"></path><path d="M10 10l0 .01"></path><path d="M14 10l0 .01"></path><path d="M18 10l0 .01"></path><path d="M6 14l0 .01"></path><path d="M18 14l0 .01"></path><path d="M10 14l4 .01"></path></svg> <p class="text-xl leading-relaxed text-white/95">學識粵拼，可以用粵拼輸入法嚟打粵語，作爲最自然簡單嘅打字方式。</p> </div> </div> </div> </section> <section class="bg-neutral-50 text-neutral-900"> <div class="mx-auto max-w-6xl px-6 py-20 md:py-24"> <h2 class="mb-12 text-center text-3xl font-bold md:mb-14 md:text-5xl"> 粵拼生態 </h2> <div class="grid grid-cols-1 gap-6 md:grid-cols-3"> <article class="flex flex-col rounded-3xl bg-white p-8 transition-all"> <a href="/keyboard#input-methods" class="mb-6 inline-flex w-fit items-center gap-2 rounded-full bg-[#1678d3]/10 px-3 py-1 text-sm font-semibold text-[#1678d3] no-underline transition-colors hover:bg-[#1678d3]/15 hover:text-[#1678d3] hover:no-underline visited:text-[#1678d3]"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-keyboard h-4 w-4"><path d="M2 8a2 2 0 0 1 2 -2h16a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-16a2 2 0 0 1 -2 -2l0 -8"></path><path d="M6 10l0 .01"></path><path d="M10 10l0 .01"></path><path d="M14 10l0 .01"></path><path d="M18 10l0 .01"></path><path d="M6 14l0 .01"></path><path d="M18 14l0 .01"></path><path d="M10 14l4 .01"></path></svg> 打字 </a> <div class="mt-auto space-y-2"> <a href="https://www.typeduck.hk/web/" target="_blank" rel="noopener noreferrer" class="flex items-center gap-3 rounded-xl bg-neutral-50 px-4 py-3 text-neutral-900 no-underline transition-colors hover:bg-[#1678d3]/8 hover:text-neutral-900 hover:no-underline visited:text-neutral-900"> <div class="h-12 w-12 flex-shrink-0 overflow-hidden rounded-lg ring-1 ring-neutral-200 bg-white"> <img src="/_astro/typeduck-app-icon.BZqprVhE_Z12fsnn.webp" alt="TypeDuck" loading="lazy" decoding="async" width="48" height="48" class="h-full w-full object-cover"> </div> <div class="min-w-0 flex-1"> <p class="truncate text-sm font-semibold">TypeDuck</p> <p class="truncate text-xs text-neutral-500"> typeduck.hk </p> </div> </a><a href="https://jyutping.app/" target="_blank" rel="noopener noreferrer" class="flex items-center gap-3 rounded-xl bg-neutral-50 px-4 py-3 text-neutral-900 no-underline transition-colors hover:bg-[#1678d3]/8 hover:text-neutral-900 hover:no-underline visited:text-neutral-900"> <div class="h-12 w-12 flex-shrink-0 overflow-hidden rounded-lg ring-1 ring-neutral-200 bg-white"> <img src="/_astro/jyutping-app.DxkkKmVz_ZUmeEp.webp" alt="粵拼輸入法" loading="lazy" decoding="async" width="48" height="48" class="h-full w-full object-cover"> </div> <div class="min-w-0 flex-1"> <p class="truncate text-sm font-semibold">粵拼輸入法</p> <p class="truncate text-xs text-neutral-500"> jyutping.app </p> </div> </a><a href="https://apps.apple.com/us/app/cantoboard-%E6%99%BA%E8%83%BD%E5%BB%A3%E6%9D%B1%E8%A9%B1%E4%B8%AD%E6%96%87%E8%BC%B8%E5%85%A5%E6%B3%95%E9%8D%B5%E7%9B%A4/id6752963850" target="_blank" rel="noopener noreferrer" class="flex items-center gap-3 rounded-xl bg-neutral-50 px-4 py-3 text-neutral-900 no-underline transition-colors hover:bg-[#1678d3]/8 hover:text-neutral-900 hover:no-underline visited:text-neutral-900"> <div class="h-12 w-12 flex-shrink-0 overflow-hidden rounded-lg ring-1 ring-neutral-200 bg-white"> <img src="/_astro/cantoboard.Bf0jiTfZ_aqsxs.webp" alt="Cantoboard" loading="lazy" decoding="async" width="48" height="48" class="h-full w-full object-cover"> </div> <div class="min-w-0 flex-1"> <p class="truncate text-sm font-semibold">Cantoboard</p> <p class="truncate text-xs text-neutral-500"> App Store </p> </div> </a> </div> </article><article class="flex flex-col rounded-3xl bg-white p-8 transition-all"> <a href="/keyboard#dictionaries" class="mb-6 inline-flex w-fit items-center gap-2 rounded-full bg-[#6CAF59]/15 px-3 py-1 text-sm font-semibold text-[#4a8f3d] no-underline transition-colors hover:bg-[#6CAF59]/20 hover:text-[#4a8f3d] hover:no-underline visited:text-[#4a8f3d]"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-vocabulary h-4 w-4"><path d="M10 19h-6a1 1 0 0 1 -1 -1v-14a1 1 0 0 1 1 -1h6a2 2 0 0 1 2 2a2 2 0 0 1 2 -2h6a1 1 0 0 1 1 1v14a1 1 0 0 1 -1 1h-6a2 2 0 0 0 -2 2a2 2 0 0 0 -2 -2"></path><path d="M12 5v16"></path><path d="M7 7h1"></path><path d="M7 11h1"></path><path d="M16 7h1"></path><path d="M16 11h1"></path><path d="M16 15h1"></path></svg> 查字 </a> <div class="mt-auto space-y-2"> <a href="https://jyut.net/" target="_blank" rel="noopener noreferrer" class="flex items-center gap-3 rounded-xl bg-neutral-50 px-4 py-3 text-neutral-900 no-underline transition-colors hover:bg-[#1678d3]/8 hover:text-neutral-900 hover:no-underline visited:text-neutral-900"> <div class="h-12 w-12 flex-shrink-0 overflow-hidden rounded-lg ring-1 ring-neutral-200 bg-[#647d8a]"> <img src="/_astro/jyutnet-icon.DNLXM_xu_1r6KMX.webp" alt="粵音資料集叢" loading="lazy" decoding="async" width="48" height="48" class="h-full w-full object-cover"> </div> <div class="min-w-0 flex-1"> <p class="truncate text-sm font-semibold">粵音資料集叢</p> <p class="truncate text-xs text-neutral-500"> jyut.net </p> </div> </a><a href="https://jyutjyu.com/" target="_blank" rel="noopener noreferrer" class="flex items-center gap-3 rounded-xl bg-neutral-50 px-4 py-3 text-neutral-900 no-underline transition-colors hover:bg-[#1678d3]/8 hover:text-neutral-900 hover:no-underline visited:text-neutral-900"> <div class="h-12 w-12 flex-shrink-0 overflow-hidden rounded-lg ring-1 ring-neutral-200 bg-white"> <img src="/img/jyutjyu.svg" alt="粵語辭叢" class="h-full w-full object-cover" loading="lazy"> </div> <div class="min-w-0 flex-1"> <p class="truncate text-sm font-semibold">粵語辭叢</p> <p class="truncate text-xs text-neutral-500"> jyutjyu.com </p> </div> </a><a href="https://translate.google.com/?hl=yue&#38;sl=auto&#38;tl=en&#38;op=translate" target="_blank" rel="noopener noreferrer" class="flex items-center gap-3 rounded-xl bg-neutral-50 px-4 py-3 text-neutral-900 no-underline transition-colors hover:bg-[#1678d3]/8 hover:text-neutral-900 hover:no-underline visited:text-neutral-900"> <div class="h-12 w-12 flex-shrink-0 overflow-hidden rounded-lg ring-1 ring-neutral-200 bg-white"> <img src="/_astro/google-translate.CKQKBhsK_I93cj.webp" alt="Google Translate" loading="lazy" decoding="async" width="48" height="48" class="h-full w-full object-cover"> </div> <div class="min-w-0 flex-1"> <p class="truncate text-sm font-semibold">Google Translate</p> <p class="truncate text-xs text-neutral-500"> translate.google.com </p> </div> </a> </div> </article><article class="flex flex-col rounded-3xl bg-white p-8 transition-all"> <a href="/keyboard#learning" class="mb-6 inline-flex w-fit items-center gap-2 rounded-full bg-yellow-300/30 px-3 py-1 text-sm font-semibold text-yellow-800 no-underline transition-colors hover:bg-yellow-300/40 hover:text-yellow-800 hover:no-underline visited:text-yellow-800"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="none" class="tabler-icon tabler-icon-player-play-filled h-4 w-4"><path d="M6 4v16a1 1 0 0 0 1.524 .852l13 -8a1 1 0 0 0 0 -1.704l-13 -8a1 1 0 0 0 -1.524 .852z"></path></svg> 學習 </a> <div class="mt-auto space-y-2"> <a href="https://chaaklau.github.io/LearnDuck/" target="_blank" rel="noopener noreferrer" class="flex items-center gap-3 rounded-xl bg-neutral-50 px-4 py-3 text-neutral-900 no-underline transition-colors hover:bg-[#1678d3]/8 hover:text-neutral-900 hover:no-underline visited:text-neutral-900"> <div class="h-12 w-12 flex-shrink-0 overflow-hidden rounded-lg ring-1 ring-neutral-200 bg-white"> <img src="/_astro/learnduck.DTi3yWLv_ezHGC.webp" alt="LearnDuck" loading="lazy" decoding="async" width="48" height="48" class="h-full w-full object-cover"> </div> <div class="min-w-0 flex-1"> <p class="truncate text-sm font-semibold">LearnDuck</p> <p class="truncate text-xs text-neutral-500"> learnduck.app </p> </div> </a><a href="https://hambaanglaang.hk/" target="_blank" rel="noopener noreferrer" class="flex items-center gap-3 rounded-xl bg-neutral-50 px-4 py-3 text-neutral-900 no-underline transition-colors hover:bg-[#1678d3]/8 hover:text-neutral-900 hover:no-underline visited:text-neutral-900"> <div class="h-12 w-12 flex-shrink-0 overflow-hidden rounded-lg ring-1 ring-neutral-200 bg-white"> <img src="/_astro/hambaanglaang-logo-neon.DK3Qcjau_HGdgL.webp" alt="冚唪唥粵文" loading="lazy" decoding="async" width="48" height="48" class="h-full w-full object-cover"> </div> <div class="min-w-0 flex-1"> <p class="truncate text-sm font-semibold">冚唪唥粵文</p> <p class="truncate text-xs text-neutral-500"> hambaanglaang.hk </p> </div> </a><a href="https://www.polyu.edu.hk/clc/cantonese/home/" target="_blank" rel="noopener noreferrer" class="flex items-center gap-3 rounded-xl bg-neutral-50 px-4 py-3 text-neutral-900 no-underline transition-colors hover:bg-[#1678d3]/8 hover:text-neutral-900 hover:no-underline visited:text-neutral-900"> <div class="h-12 w-12 flex-shrink-0 overflow-hidden rounded-lg ring-1 ring-neutral-200 bg-white"> <img src="/_astro/flipped.EXe_UCWe_qYYqR.webp" alt="翻轉粵語教室" loading="lazy" decoding="async" width="48" height="48" class="h-full w-full object-cover"> </div> <div class="min-w-0 flex-1"> <p class="truncate text-sm font-semibold">翻轉粵語教室</p> <p class="truncate text-xs text-neutral-500"> polyu.edu.hk </p> </div> </a> </div> </article> </div> </div> </section> <section class="bg-[#1678d3] text-white"> <div class="mx-auto max-w-4xl px-6 py-20 text-center"> <p class="font-jyutping mb-10 text-4xl leading-tight md:text-5xl"> 識粵語就要學粵拼 </p> <div class="flex flex-wrap justify-center gap-4"> <a href="/jyutping" class="inline-flex items-center gap-2 rounded-full bg-[#F4E6A6] px-7 py-3.5 text-lg font-semibold text-[#0C4F8C] transition-colors hover:bg-[#F8EDBF]"> 睇粵拼方案表 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-table h-5 w-5"><path d="M3 5a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-14"></path><path d="M3 10h18"></path><path d="M10 3v18"></path></svg> </a> <a href="/keyboard" class="inline-flex items-center gap-2 rounded-full bg-[#E6F0FF] px-7 py-3.5 text-lg font-semibold text-[#0C4F8C] transition-colors hover:bg-[#F0F6FF]"> 粵拼資源輸入法 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-keyboard h-5 w-5"><path d="M2 8a2 2 0 0 1 2 -2h16a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-16a2 2 0 0 1 -2 -2l0 -8"></path><path d="M6 10l0 .01"></path><path d="M10 10l0 .01"></path><path d="M14 10l0 .01"></path><path d="M18 10l0 .01"></path><path d="M6 14l0 .01"></path><path d="M18 14l0 .01"></path><path d="M10 14l4 .01"></path></svg> </a> </div> </div> </section> <section class="bg-neutral-100 text-neutral-900"> <div class="mx-auto max-w-5xl px-6 py-14"> <p class="mb-8 flex items-center justify-center gap-2 text-center text-lg font-semibold text-neutral-700"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-world h-5 w-5"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0"></path><path d="M3.6 9h16.8"></path><path d="M3.6 15h16.8"></path><path d="M11.5 3a17 17 0 0 0 0 18"></path><path d="M12.5 3a17 17 0 0 1 0 18"></path></svg> 唔識粵語？ </p> <div class="flex flex-wrap justify-center gap-3"> <a lang="cmn" href="/cmn" class="rounded-full border border-gray-600 bg-white px-5 py-2.5 text-sm font-medium text-neutral-800 transition-all hover:border-[#1678d3] hover:text-[#1678d3]"> 切到普通話 / 國語版 </a><a lang="nan" href="/nan" class="rounded-full border border-gray-600 bg-white px-5 py-2.5 text-sm font-medium text-neutral-800 transition-all hover:border-[#1678d3] hover:text-[#1678d3]"> 換到台灣閩南語版 </a><a lang="wuu" href="/wuu" class="rounded-full border border-gray-600 bg-white px-5 py-2.5 text-sm font-medium text-neutral-800 transition-all hover:border-[#1678d3] hover:text-[#1678d3]"> 換到吳語版 </a><a lang="vi" href="/vi" class="rounded-full border border-gray-600 bg-white px-5 py-2.5 text-sm font-medium text-neutral-800 transition-all hover:border-[#1678d3] hover:text-[#1678d3]"> Chuyển sang tiếng Việt </a><a lang="en" href="/en" class="rounded-full border border-gray-600 bg-white px-5 py-2.5 text-sm font-medium text-neutral-800 transition-all hover:border-[#1678d3] hover:text-[#1678d3]"> Switch to English </a><a lang="ja" href="/ja" class="rounded-full border border-gray-600 bg-white px-5 py-2.5 text-sm font-medium text-neutral-800 transition-all hover:border-[#1678d3] hover:text-[#1678d3]"> 日本語版に切り替える </a> </div> </div> </section>  <div id="dynamic-audio-container" class="hidden" aria-hidden data-audio-base-path="/audio/"></div> </main> <footer class="p-8 bg-gray-600 text-center text-white">  <div class="my-2"> <span>&copy; 2026 jyutping.org</span> </div>  <div class="my-2 inline-flex items-center justify-center space-x-4"> <a href="https://github.com/CanCLID/jyutping.org" target="_blank" rel="noopener noreferrer" class="text-white hover:opacity-80" aria-label="GitHub Repository"> <svg xmlns="http://www.w3.org/2000/svg" width="1.25rem" height="1.25rem" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-brand-github "><path d="M9 19c-4.3 1.4 -4.3 -2.5 -6 -3m12 5v-3.5c0 -1 .1 -1.4 -.5 -2c2.8 -.3 5.5 -1.4 5.5 -6a4.6 4.6 0 0 0 -1.3 -3.2a4.2 4.2 0 0 0 -.1 -3.2s-1.1 -.3 -3.5 1.3a12.3 12.3 0 0 0 -6.2 0c-2.4 -1.6 -3.5 -1.3 -3.5 -1.3a4.2 4.2 0 0 0 -.1 3.2a4.6 4.6 0 0 0 -1.3 3.2c0 4.6 2.7 5.7 5.5 6c-.6 .6 -.6 1.2 -.5 2v3.5"></path></svg> </a> <a href="/cdn-cgi/l/email-protection#186b6d6868776a6c5872616d6c6871767f36776a7f" target="_blank" rel="noopener noreferrer" class="text-white hover:opacity-80" aria-label="Email Support"> <svg xmlns="http://www.w3.org/2000/svg" width="1.25rem" height="1.25rem" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-mail "><path d="M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10"></path><path d="M3 7l9 6l9 -6"></path></svg> </a> <a href="https://huggingface.co/CanCLID" target="_blank" rel="noopener noreferrer" class="text-white hover:opacity-80" aria-label="Hugging Face Profile">
🤗
</a> <a href="https://x.com/Can_CLID" target="_blank" rel="noopener noreferrer" class="text-white hover:opacity-80" aria-label="X (formerly Twitter) Profile"> <svg xmlns="http://www.w3.org/2000/svg" width="1.25rem" height="1.25rem" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-brand-x "><path d="M4 4l11.733 16h4.267l-11.733 -16l-4.267 0"></path><path d="M4 20l6.768 -6.768m2.46 -2.46l6.772 -6.772"></path></svg> </a> </div> </footer> <script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script></body></html>