1<!DOCTYPE html><html dir="ltr" lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" as="image" href="/brand-mark.svg"/><title>Free Arabic Calligraphy Generator | PNG, SVG & PDF</title><meta name="theme-color" content="#102f28"/><meta name="description" content="Create Arabic calligraphy online with correct RTL shaping, Harakat support and 12 licensed fonts. Export free PNG, SVG or vector PDF."/><meta property="og:type" content="website"/><meta property="og:site_name" content="Arabic Calligraphy Studio"/><meta property="og:locale" content="en_US"/><meta property="og:locale:alternate" content="ar_AR"/><meta property="og:title" content="Free Arabic Calligraphy Generator | PNG, SVG & PDF"/><meta property="og:description" content="Create Arabic calligraphy online with correct RTL shaping, Harakat support and 12 licensed fonts. Export free PNG, SVG or vector PDF."/><meta property="og:url" content="https://arabiccalligraphy.app/"/><meta property="og:image" content="https://arabiccalligraphy.app/og.png"/><meta name="twitter:title" content="Free Arabic Calligraphy Generator | PNG, SVG & PDF"/><meta name="twitter:description" content="Create Arabic calligraphy online with correct RTL shaping, Harakat support and 12 licensed fonts. Export free PNG, SVG or vector PDF."/><meta name="twitter:url" content="https://arabiccalligraphy.app/"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:image" content="https://arabiccalligraphy.app/og.png"/><link rel="modulepreload" href="/assets/main-CAlPfnCw.js"/><link rel="modulepreload" href="/assets/index-TqwRL_ec.js"/><link rel="modulepreload" href="/assets/use-shape-worker-LzHjpdjT.js"/><link rel="modulepreload" href="/assets/svg-DJjHET4h.js"/><link rel="modulepreload" href="/assets/registry-I7h79uUO.js"/><link rel="modulepreload" href="/assets/IconLoader2-BW8fIxNM.js"/><link rel="modulepreload" href="/assets/IconArrowRight-BI-fCxwy.js"/><link rel="modulepreload" href="/assets/font-preview-C2ULUkLg.js"/><link rel="modulepreload" href="/assets/IconVectorBezier2-gTXwLeb4.js"/><link rel="modulepreload" href="/assets/IconLock-ByfRZaai.js"/><link rel="icon" type="image/svg+xml" href="/brand-mark.svg"/><link rel="manifest" href="/manifest.json"/><link rel="canonical" href="https://arabiccalligraphy.app/"/><link rel="alternate" hrefLang="en" href="https://arabiccalligraphy.app/"/><link rel="alternate" hrefLang="ar" href="https://arabiccalligraphy.app/ar/"/><link rel="alternate" hrefLang="x-default" href="https://arabiccalligraphy.app/"/><link rel="stylesheet" href="/assets/styles-LOrYhEYK.css"/>
1<script type="application/ld+json">[{"@context":"https://schema.org","@type":"WebSite","name":"Arabic Calligraphy Studio","description":"Create Arabic calligraphy online with correct RTL shaping, Harakat support and 12 licensed fonts. Export free PNG, SVG or vector PDF.","url":"https://arabiccalligraphy.app/","inLanguage":"en"},{"@context":"https://schema.org","@type":"WebApplication","name":"Arabic Calligraphy Studio","applicationCategory":"DesignApplication","browserRequirements":"Requires JavaScript and WebAssembly","description":"Create Arabic calligraphy online with correct RTL shaping, Harakat support and 12 licensed fonts. Export free PNG, SVG or vector PDF.","operatingSystem":"Web","isAccessibleForFree":true,"featureList":["Correct Arabic RTL and mixed-text shaping","Harakat and diacritic support","12 self-hosted Arabic fonts","PNG, SVG and vector PDF export"],"offers":{"@type":"Offer","price":"0","priceCurrency":"USD"},"url":"https://arabiccalligraphy.app/"},{"@context":"https://schema.org","@type":"Organization","name":"Arabic Calligraphy Studio","url":"https://arabiccalligraphy.app/"}]</script>
1</head><body>
1<script>(function() { 2 try { 3 var theme = localStorage.getItem('theme') || 'light'; 4 var systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'; 5 var resolved = theme === 'system' ? systemTheme : theme; 6 document.documentElement.classList.add(resolved); 7 } catch (e) { 8 document.documentElement.classList.add('light'); 9 } 10})();;document.currentScript.remove()</script>
10<div class="flex min-h-screen flex-col"><header class="sticky inset-x-0 top-0 z-40 py-4 transition-all duration-300"><div class="relative z-10"><div class="container mx-auto max-w-7xl px-4"><nav aria-label="Main navigation" class="hidden lg:flex lg:items-center lg:justify-between lg:gap-4"><a aria-label="Home" class="flex items-center gap-2 shrink-0 active" href="/" data-status="active" aria-current="page"><img src="/brand-mark.svg" alt="Arabic Calligraphy Studio logo" class="size-8 rounded-md dark:hidden" width="32" height="32" decoding="async"/><img src="/brand-mark.svg" alt="Arabic Calligraphy Studio logo" class="size-8 rounded-md hidden dark:block" width="32" height="32" decoding="async"/><span class="text-xl font-semibold">Arabic Calligraphy Studio</span></a><nav data-slot="navigation-menu" class="group/navigation-menu relative flex max-w-max items-center flex-1 justify-center"><ul data-slot="navigation-menu-list" class="group flex flex-1 list-none items-center justify-center gap-0"><li data-slot="navigation-menu-item" class="relative"><a data-slot="navigation-menu-link" href="/studio" class="gap-2 p-2 in-data-[slot=navigation-menu-content]:rounded-md data-active:bg-muted/50 data-active:hover:bg-muted data-active:focus:bg-muted [&_svg:not([class*='size-'])]:size-4 group/navigation-menu-trigger inline-flex h-9 w-max items-center justify-center rounded-lg px-2.5 py-1.5 text-sm font-medium transition-all outline-none hover:bg-muted focus:bg-muted focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted data-open:bg-muted/50 data-open:hover:bg-muted data-open:focus:bg-muted bg-transparent">Studio</a></li><li data-slot="navigation-menu-item" class="relative"><a data-slot="navigation-menu-link" href="/templates" class="gap-2 p-2 in-data-[slot=navigation-menu-content]:rounded-md data-active:bg-muted/50 data-active:hover:bg-muted data-active:focus:bg-muted [&_svg:not([class*='size-'])]:size-4 group/navigation-menu-trigger inline-flex h-9 w-max items-center justify-center rounded-lg px-2.5 py-1.5 text-sm font-medium transition-all outline-none hover:bg-muted focus:bg-muted focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted data-open:bg-muted/50 data-open:hover:bg-muted data-open:focus:bg-muted bg-transparent">Templates</a></li><li data-slot="navigation-menu-item" class="relative"><a data-slot="navigation-menu-link" href="/fonts" class="gap-2 p-2 in-data-[slot=navigation-menu-content]:rounded-md data-active:bg-muted/50 data-active:hover:bg-muted data-active:focus:bg-muted [&_svg:not([class*='size-'])]:size-4 group/navigation-menu-trigger inline-flex h-9 w-max items-center justify-center rounded-lg px-2.5 py-1.5 text-sm font-medium transition-all outline-none hover:bg-muted focus:bg-muted focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted data-open:bg-muted/50 data-open:hover:bg-muted data-open:focus:bg-muted bg-transparent">Fonts</a></li><li data-slot="navigation-menu-item" class="relative"><a data-slot="navigation-menu-link" href="/how-arabic-shaping-works" class="gap-2 p-2 in-data-[slot=navigation-menu-content]:rounded-md data-active:bg-muted/50 data-active:hover:bg-muted data-active:focus:bg-muted [&_svg:not([class*='size-'])]:size-4 group/navigation-menu-trigger inline-flex h-9 w-max items-center justify-center rounded-lg px-2.5 py-1.5 text-sm font-medium transition-all outline-none hover:bg-muted focus:bg-muted focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted data-open:bg-muted/50 data-open:hover:bg-muted data-open:focus:bg-muted bg-transparent">How it works</a></li><li data-slot="navigation-menu-item" class="relative">
10<a data-slot="navigation-menu-link" href="/license" class="gap-2 p-2 in-data-[slot=navigation-menu-content]:rounded-md data-active:bg-muted/50 data-active:hover:bg-muted data-active:focus:bg-muted [&_svg:not([class*='size-'])]:size-4 group/navigation-menu-trigger inline-flex h-9 w-max items-center justify-center rounded-lg px-2.5 py-1.5 text-sm font-medium transition-all outline-none hover:bg-muted focus:bg-muted focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted data-open:bg-muted/50 data-open:hover:bg-muted data-open:focus:bg-muted bg-transparent">License</a></li></ul></nav><div class="flex items-center gap-4 shrink-0"><button type="button" tabindex="0" aria-haspopup="menu" id="base-ui-_R_rmaoq_" data-slot="dropdown-menu-trigger" aria-label="language" class="flex size-8 shrink-0 items-center justify-center rounded-full border border-border bg-transparent p-0 hover:bg-accent"><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-language size-4"><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></button><button type="button" tabindex="0" aria-haspopup="menu" id="base-ui-_R_tmaoq_" data-slot="dropdown-menu-trigger" aria-label="Toggle theme" class="flex size-8 shrink-0 items-center justify-center rounded-full border border-border bg-transparent p-0 hover:bg-accent"><span class="relative inline-flex size-4 items-center justify-center"><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-sun size-4 rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0"><path d="M8 12a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"></path><path d="M3 12h1m8 -9v1m8 8h1m-9 8v1m-6.4 -15.4l.7 .7m12.1 -.7l-.7 .7m0 11.4l.7 .7m-12.1 -.7l-.7 .7"></path></svg><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-moon absolute size-4 rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100"><path d="M12 3c.132 0 .263 0 .393 0a7.5 7.5 0 0 0 7.92 12.446a9 9 0 1 1 -8.313 -12.454l0 .008"></path></svg></span></button></div></nav></div></div></header><main id="main-content" class="flex-1"><!--$--><div class="overflow-hidden"><style>@font-face { 11 font-family: "acs-preview-amiri"; 12 src: url("/assets/preview-CeUhBDU7.woff2") format("woff2"); 13 font-display: swap; 14 font-style: normal; 15 font-weight: 100 900; 16} 17@font-face { 18 font-family: "acs-preview-aref-ruqaa"; 19 src: url("/assets/preview-Bxro0syR.woff2") format("woff2"); 20 font-display: swap; 21 font-style: normal; 22 font-weight: 100 900; 23} 24@font-face { 25 font-family: "acs-preview-cairo"; 26 src: url("/assets/preview-BDujb0oI.woff2") format("woff2"); 27 font-display: swap; 28 font-style: normal; 29 font-weight: 100 900; 30} 31@font-face { 32 font-family: "acs-preview-changa"; 33 src: url("/assets/preview-BJu27i4p.woff2") format("woff2"); 34 font-display: swap; 35 font-style: normal; 36 font-weight: 100 900; 37} 38@font-face { 39 font-family: "acs-preview-harmattan"; 40 src: url("/assets/preview-PJUZCA4i.woff2") format("woff2"); 41 font-display: swap; 42 font-style: normal; 43 font-weight: 100 900; 44} 45@font-face { 46 font-family: "acs-preview-lateef"; 47 src: url("/assets/preview-CmGaAUTf.woff2") format("woff2"); 48 font-display: swap; 49 font-style: normal; 50 font-weight: 100 900; 51} 52@font-face { 53 font-family: "acs-preview-markazi-text"; 54 src: url("/assets/preview-BxNQEIWM.woff2") format("woff2"); 55 font-display: swap; 56 font-style: normal; 57 font-weight: 100 900; 58} 59@font-face { 60 font-family: "acs-preview-noto-kufi-arabic"; 61 src: url("/assets/preview-C5uj3pvd.woff2") format("woff2"); 62 font-display: swap; 63 font-style: normal; 64 font-weight: 100 900; 65} 66@font-face { 67 font-family: "acs-preview-noto-naskh-arabic"; 68 src: url("/assets/preview-C62qd92B.woff2") format("woff2"); 69 font-display: swap; 70 font-style: normal; 71 font-weight: 100 900; 72} 73@font-face { 74 font-family: "acs-preview-noto-sans-arabic"; 75 src: url("/assets/preview-CY2OZO-j.woff2") format("woff2"); 76 font-display: swap; 77 font-style: normal; 78 font-weight: 100 900; 79} 80@font-face { 81 font-family: "acs-preview-reem-kufi"; 82 src: url("/assets/preview-BhsyHhfJ.woff2") format("woff2"); 83 font-display: swap; 84 font-style: normal; 85 font-weight: 100 900; 86} 87@font-face { 88 font-family: "acs-preview-scheherazade-new"; 89 src: url("/assets/preview-0wYs2ilH.woff2") format("woff2"); 90 font-display: swap; 91 font-style: normal; 92 font-weight: 100 900; 93}</style><section class="relative px-4 pt-12 pb-20 sm:px-6 lg:pt-20"><div aria-hidden="true" class="absolute inset-x-0 top-0 -z-10 h-[520px] bg-[radial-gradient(circle_at_76%_16%,rgba(23,79,64,0.14),transparent_36%)]"></div><div class="mx-auto grid max-w-[1240px] gap-10 lg:grid-cols-[0.8fr_1.2fr] lg:items-center"><div><p class="mb-5 inline-flex items-center gap-2 rounded-lg border border-primary/20 bg-primary/5 px-3 py-1.5 text-xs font-semibold text-primary"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-vector-bezier-2 " aria-hidden="true"><path d="M3 4a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1l0 -2"></path><path d="M17 18a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1l0 -2"></path><path d="M7 5l7 0"></path><path d="M10 19l7 0"></path><path d="M8 19a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M14 5a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M7 5.5a5 6.5 0 0 1 5 6.5a5 6.5 0 0 0 5 6.5"></path></svg>Arabic shaping with editable paths</p><h1 class="max-w-[12ch] text-5xl font-semibold leading-[0.93] tracking-[-0.055em] sm:text-6xl lg:text-7xl">Free Arabic Calligraphy Generator</h1><p class="mt-6 max-w-[52ch] text-base leading-7 text-muted-foreground sm:text-lg">Create Arabic calligraphy online with correct RTL shaping, Harakat, numbers, and Latin text. Design with 12 licensed fonts, then export a free PNG, path SVG, or vector PDF without an account.</p><div class="mt-8 flex flex-wrap gap-3"><a href="/studio" class="inline-flex min-h-11 items-center gap-2 rounded-lg bg-primary px-5 text-sm font-semibold text-primary-foreground hover:bg-primary/90">Start designing<svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" 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 " aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></a><a class="inline-flex min-h-11 items-center rounded-lg border bg-card px-5 text-sm font-semibold hover:bg-muted" href="#how-it-works">See how shaping works</a></div><dl class="mt-10 grid grid-cols-3 gap-4 border-t pt-5 text-xs"><div><dt class="text-muted-foreground">Fonts</dt><dd class="mt-1 font-semibold">12 OFL families</dd></div><div><dt class="text-muted-foreground">Exports</dt><dd class="mt-1 font-semibold">PNG · SVG · PDF</dd></div><div><dt class="text-muted-foreground">Privacy</dt><dd class="mt-1 font-semibold">Local by default</dd></div></dl></div><div class="overflow-hidden rounded-2xl border border-white/10 bg-[#081b16] text-[#fbf7ed] shadow-[0_32px_90px_rgba(7,29,23,0.22)]"><div class="flex items-center justify-between border-b border-white/10 px-4 py-3"><div class="flex items-center gap-2 text-xs font-medium">
93<span aria-hidden="true" class="size-2 rounded-full bg-emerald-400"></span>Live path preview</div><span class="font-mono text-sm text-white/55">Local in your browser</span></div><div class="grid min-h-[450px] lg:grid-cols-[230px_minmax(0,1fr)]"><div class="grid content-start gap-5 border-b border-white/10 p-4 lg:border-r lg:border-b-0"><label class="grid gap-2 text-xs font-medium text-white/65">Arabic or mixed text<textarea class="min-h-28 resize-y rounded-xl border border-white/15 bg-black/15 px-3 py-3 font-arabic text-2xl leading-relaxed text-white outline-none focus-visible:border-emerald-300 focus-visible:ring-2 focus-visible:ring-emerald-300/25" dir="rtl" maxLength="5000">Ø³ÙØ§Ù
</textarea></label><label class="grid gap-2 text-xs font-medium text-white/65">Licensed font<select class="h-10 rounded-lg border border-white/15 bg-[#0d271f] px-3 text-sm text-white outline-none focus-visible:border-emerald-300"><option value="amiri" selected="">Amiri</option><option value="aref-ruqaa">Aref Ruqaa</option><option value="cairo">Cairo</option><option value="changa">Changa</option><option value="harmattan">Harmattan</option><option value="lateef">Lateef</option><option value="markazi-text">Markazi Text</option><option value="noto-kufi-arabic">Noto Kufi Arabic</option><option value="noto-naskh-arabic">Noto Naskh Arabic</option><option value="noto-sans-arabic">Noto Sans Arabic</option><option value="reem-kufi">Reem Kufi</option><option value="scheherazade-new">Scheherazade New</option></select></label><p class="text-xs leading-5 text-white/55">Correct shaping is not translation review. Ask a native speaker before permanent use.</p></div><div class="flex min-h-[330px] flex-col bg-[#c8ccc3] p-3 sm:p-5"><div class="grid min-h-0 flex-1 place-items-center overflow-hidden bg-[#f4efe3] p-5 shadow-inner"><div class="grid place-items-center gap-2 text-[#163b31]"><svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-loader-2 animate-spin" aria-hidden="true"><path d="M12 3a9 9 0 1 0 9 9"></path></svg><span class="text-xs">Loading font</span></div></div><div class="mt-3 flex flex-wrap items-center justify-between gap-2 text-[#102f28]"><span class="text-xs">Loading font</span><div class="flex gap-2"><button class="inline-flex min-h-9 items-center gap-2 rounded-lg border border-[#163b31]/20 bg-[#f4efe3] px-3 text-xs font-semibold hover:bg-white disabled:opacity-50" disabled="" type="button"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-download " aria-hidden="true"><path d="M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-2"></path><path d="M7 11l5 5l5 -5"></path><path d="M12 4l0 12"></path></svg>Free PNG</button><a href="/studio" class="inline-flex min-h-9 items-center gap-2 rounded-lg bg-[#163b31] px-3 text-xs font-semibold text-white hover:bg-[#214d41]">Open Studio<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" 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 " aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></a></div></div></div></div></div></div></section><section class="border-y bg-[#102f28] px-4 py-20 text-[#fbf7ed] sm:px-6" id="how-it-works"><div class="mx-auto max-w-[1240px]"><div class="grid gap-8 lg:grid-cols-[0.75fr_1.25fr]"><div><p class="text-xs font-semibold uppercase tracking-[0.16em] text-emerald-300">One rendering engine</p><h2 class="mt-4 max-w-[12ch] text-4xl font-semibold leading-tight tracking-[-0.04em] sm:text-5xl">The preview is the export.</h2></div><div class="grid gap-px overflow-hidden rounded-2xl border border-white/10 bg-white/10 sm:grid-cols-2"><div class="bg-[#102f28] p-6"><span class="font-mono text-xs text-emerald-300">0<!-- -->1</span>
93<h3 class="mt-8 text-lg font-semibold">Resolve direction</h3><p class="mt-2 text-sm leading-6 text-white/60">bidi-js keeps Arabic, Latin, numbers, and punctuation in their correct visual runs.</p></div><div class="bg-[#102f28] p-6"><span class="font-mono text-xs text-emerald-300">0<!-- -->2</span><h3 class="mt-8 text-lg font-semibold">Shape glyphs</h3><p class="mt-2 text-sm leading-6 text-white/60">HarfBuzz applies Arabic joining, ligatures, marks, and language features.</p></div><div class="bg-[#102f28] p-6"><span class="font-mono text-xs text-emerald-300">0<!-- -->3</span><h3 class="mt-8 text-lg font-semibold">Build outlines</h3><p class="mt-2 text-sm leading-6 text-white/60">OpenType glyph IDs become deterministic vector paths, never browser text.</p></div><div class="bg-[#102f28] p-6"><span class="font-mono text-xs text-emerald-300">0<!-- -->4</span><h3 class="mt-8 text-lg font-semibold">Export the scene</h3><p class="mt-2 text-sm leading-6 text-white/60">PNG, SVG, and PDF share those same glyph paths and layout transforms.</p></div></div></div></div></section><section class="px-4 py-20 sm:px-6"><div class="mx-auto max-w-[1240px]"><div class="grid gap-5 lg:grid-cols-3"><article class="rounded-2xl border bg-card p-6 shadow-sm"><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-photo text-primary" aria-hidden="true"><path d="M15 8h.01"></path><path d="M3 6a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3v-12"></path><path d="M3 16l5 -5c.928 -.893 2.072 -.893 3 0l5 5"></path><path d="M14 14l1 -1c.928 -.893 2.072 -.893 3 0l3 3"></path></svg><h2 class="mt-10 text-xl font-semibold">PNG for everyday work</h2><p class="mt-3 text-sm leading-6 text-muted-foreground">Useful, watermark-free images up to 1600 px on the longest edge.</p></article><article class="rounded-2xl border bg-card p-6 shadow-sm"><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-vector-bezier-2 text-primary" aria-hidden="true"><path d="M3 4a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1l0 -2"></path><path d="M17 18a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1l0 -2"></path><path d="M7 5l7 0"></path><path d="M10 19l7 0"></path><path d="M8 19a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M14 5a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M7 5.5a5 6.5 0 0 1 5 6.5a5 6.5 0 0 0 5 6.5"></path></svg><h2 class="mt-10 text-xl font-semibold">SVG with paths only</h2><p class="mt-3 text-sm leading-6 text-muted-foreground">Glyph outlines stay sharp at any size and work without an installed font.</p></article><article class="rounded-2xl border bg-card p-6 shadow-sm"><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-file-type-pdf text-primary" aria-hidden="true"><path d="M14 3v4a1 1 0 0 0 1 1h4"></path><path d="M5 12v-7a2 2 0 0 1 2 -2h7l5 5v4"></path><path d="M5 18h1.5a1.5 1.5 0 0 0 0 -3h-1.5v6"></path><path d="M17 18h2"></path><path d="M20 15h-3v6"></path><path d="M11 15v6h1a2 2 0 0 0 2 -2v-2a2 2 0 0 0 -2 -2h-1"></path></svg><h2 class="mt-10 text-xl font-semibold">PDF for production</h2><p class="mt-3 text-sm leading-6 text-muted-foreground">Vector fill and stroke paths for print. Complex effects preserve their appearance.</p></article></div></div></section><section class="border-t px-4 py-20 sm:px-6"><div class="mx-auto max-w-[1240px]"><div class="max-w-[760px]"><p class="text-xs font-semibold uppercase tracking-[0.16em] text-primary">Made for real projects</p><h2 class="mt-3 text-4xl font-semibold tracking-[-0.04em]">Arabic calligraphy for names, logos and invitations</h2><p class="mt-4 text-base leading-7 text-muted-foreground">Start from an editable layout, replace it with your own Arabic text, and keep full control of the font, color, spacing and export format. These are live design scenes, not flattened stock images.</p></div><div class="mt-9 grid gap-4 md:grid-cols-3"><a href="/studio?template=names-centered" class="group rounded-2xl border bg-card p-6 transition hover:-translate-y-0.5 hover:border-primary/50"><h3 class="text-xl font-semibold">Arabic name calligraphy</h3><p class="mt-3 text-sm leading-6 text-muted-foreground">Turn a name into a balanced personal mark for profiles, gifts and keepsakes.</p><span class="mt-6 inline-flex items-center gap-2 text-sm font-semibold text-primary group-hover:underline">Open editable layout<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewB
93ox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-right " aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></span></a><a href="/studio?template=logo-concept" class="group rounded-2xl border bg-card p-6 transition hover:-translate-y-0.5 hover:border-primary/50"><h3 class="text-xl font-semibold">Arabic logo lettering</h3><p class="mt-3 text-sm leading-6 text-muted-foreground">Build a clean Arabic wordmark and export paths that scale from screen to signage.</p><span class="mt-6 inline-flex items-center gap-2 text-sm font-semibold text-primary group-hover:underline">Open editable layout<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" 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 " aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></span></a><a href="/studio?template=wedding-invitation" class="group rounded-2xl border bg-card p-6 transition hover:-translate-y-0.5 hover:border-primary/50"><h3 class="text-xl font-semibold">Wedding invitation calligraphy</h3><p class="mt-3 text-sm leading-6 text-muted-foreground">Pair elegant lettering with editable color and spacing for wedding stationery.</p><span class="mt-6 inline-flex items-center gap-2 text-sm font-semibold text-primary group-hover:underline">Open editable layout<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" 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 " aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></span></a></div></div></section><section class="border-y bg-card px-4 py-20 sm:px-6"><div class="mx-auto max-w-[1240px]"><div class="flex flex-col justify-between gap-5 sm:flex-row sm:items-end"><div><p class="text-xs font-semibold uppercase tracking-[0.16em] text-primary">Licensed and traceable</p><h2 class="mt-3 text-4xl font-semibold tracking-[-0.04em]">12 Arabic typefaces</h2><p class="mt-3 max-w-[58ch] text-sm leading-6 text-muted-foreground">Each bundled font includes its original OFL record, source URL, family metadata, and exact version.</p></div><a href="/fonts" class="text-sm font-semibold text-primary hover:underline">Compare Arabic calligraphy fonts</a></div><div class="mt-10 grid border-t sm:grid-cols-2 lg:grid-cols-3"><div class="border-b p-5 sm:odd:border-r lg:border-r lg:nth-[3n]:border-r-0"><p class="text-3xl text-primary" dir="rtl" lang="ar" style="font-family:"acs-preview-amiri", sans-serif">Ø³ÙØ§Ù
</p><h3 class="mt-5 font-semibold">Amiri</h3><p class="mt-1 text-xs text-muted-foreground">Naskh<!-- --> · <!-- -->Version 1.002</p></div><div class="border-b p-5 sm:odd:border-r lg:border-r lg:nth-[3n]:border-r-0"><p class="text-3xl text-primary" dir="rtl" lang="ar" style="font-family:"acs-preview-aref-ruqaa", sans-serif">Ø³ÙØ§Ù
</p><h3 class="mt-5 font-semibold">Aref Ruqaa</h3><p class="mt-1 text-xs text-muted-foreground">Ruqaa<!-- --> · <!-- -->Version 1.003</p></div><div class="border-b p-5 sm:odd:border-r lg:border-r lg:nth-[3n]:border-r-0"><p class="text-3xl text-primary" dir="rtl" lang="ar" style="font-family:"acs-preview-cairo", sans-serif">Ø³ÙØ§Ù
</p><h3 class="mt-5 font-semibold">Cairo</h3><p class="mt-1 text-xs text-muted-foreground">Modern Kufi / Sans<!-- --> · <!-- -->Version 3.130;gftools[0.9.24]</p></div><div class="border-b p-5 sm:odd:border-r lg:border-r lg:nth-[3n]:border-r-0"><p class="text-3xl text-primary" dir="rtl" lang="ar" style="font-family:"acs-preview-changa", sans-serif">Ø³ÙØ§Ù
</p><h3 class="mt-5 font-semibold">Changa</h3><p class="mt-1 text-xs text-muted-foreground">Display<!-- --> · <!-- -->Version 3.003</p></div><div class="border-b p-5 sm:odd:border-r lg:border-r lg:nth-[3n]:border-r-0"><p class="text-3xl text-primary" dir="rtl" lang="ar" style="font-family:"acs-preview-harmattan", sans-serif">Ø³ÙØ§Ù
</p><h3 class="mt-5 font-semibold">Harmattan</h3><p class="mt-1 text-xs text-muted-foreground">Readable Naskh<!-- --> · <!-- -->Version 4.400</p></div><div class="border-b p-5 sm:odd:border-r lg:border-r lg:nth-[3n]:border-r-0"><p class="text-3xl text-primary" dir="rtl" lang="ar" style="font-family:"acs-preview-lateef", sans-serif">Ø³ÙØ§Ù
</p><h3 class="mt-5 font-semibold">Lateef</h3><p class="mt-1 text-xs text-muted-foreground">Calligraphic Naskh<!-- --> · <!-- -->Version 4.400</p></div><div class="border-b p-5 sm:odd:border-r lg:border-r lg:nth-[3n]:border-r-0"><p class="text-3xl text-primary" dir="rtl" lang="ar" style="font-family:"acs-preview-markazi-text", sans-serif">Ø³ÙØ§Ù
</p><h3 class="mt-5 font-semibold">Markazi Text</h3><p class="mt-1 text-xs text-muted-foreground">Formal display<!-- --> · <!-- -->Version 1.001</p></div><div class="border-b p-5 sm:odd:border-r lg:border-r lg:nth-[3n]:border-r-0"><p class="text-3xl text-primary" dir="rtl" lang="ar" style="font-family:"acs-preview-noto-kufi-arabic", sans-serif">Ø³ÙØ§Ù
</p><h3 class="mt-5 font-semibold">Noto Kufi Arabic</h3><p class="mt-1 text-xs text-muted-foreground">Kufi<!-- --> · <!-- -->Version 2.109</p></div><div class="border-b p-5 sm:odd:border-r lg:border-r lg:nth-[3n]:border-r-0"><p class="text-3xl text-primary" dir="rtl" lang="ar" style="font-family:"acs-preview-noto-naskh-arabic", sans-serif">Ø³ÙØ§Ù
</p><h3 class="mt-5 font-semibold">Noto Naskh Arabic</h3><p class="mt-1 text-xs text-muted-foreground">Naskh<!-- --> · <!-- -->Version 2.021</p></div><div class="border-b p-5 sm:odd:border-r lg:border-r lg:nth-[3n]:border-r-0"><p class="text-3xl text-primary" dir="rtl" lang="ar" style="font-family:"acs-preview-noto-sans-arabic", sans-serif">Ø³ÙØ§Ù
</p><h3 class="mt-5 font-semibold">Noto Sans Arabic</h3><p class="mt-1 text-xs text-muted-foreground">Arabic Sans<!-- --> · <!-- -->Version 2.012</p></div><div class="border-b p-5 sm:odd:border-r lg:border-r lg:nth-[3n]:border-r-0"><p class="text-3xl text-primary" dir="rtl" lang="ar" style="font-family:"acs-preview-reem-kufi", sans-serif">Ø³ÙØ§Ù
</p><h3 class="mt-5 font-semibold">Reem Kufi</h3><p class="mt-1 text-xs text-muted-foreground">Display Kufi<!-- --> · <!-- -->Version 2.000</p></div><div class="border-b p-5 sm:odd:border-r lg:border-r lg:nth-[3n]:border-r-0"><p class="text-3xl text-primary" dir="rtl" lang="ar" style="font-family:"acs-preview-scheherazade-new", sans-serif">Ø³ÙØ§Ù
</p><h3 class="mt-5 font-semibold">Scheherazade New</h3><p class="mt-1 text-xs text-muted-foreground">Traditional Naskh<!-- --> · <!-- -->Version 4.500</p></div></div></div></section><section class="px-4 py-20 sm:px-6"><div class="mx-auto max-w-[1240px]"><div class="grid gap-8 lg:grid-cols-[0.7fr_1.3fr]"><div><p class="text-xs font-semibold uppercase tracking-[0.16em] text-primary">Layout starters</p><h2 class="mt-3 text-4xl font-semibold tracking-[-0.04em]">Editable Arabic calligraphy templates</h2><p class="mt-4 text-sm leading-6 text-muted-foreground">Start with layouts for names, logos, weddings, geometric art and social posts. Adjust canvas, color, type scale and safe areas while keeping your source text editable.</p><a href="/templates" class="mt-6 inline-flex items-center gap-2 text-sm font-semibold text-primary hover:underline">Explore templates<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewB
93ox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-right " aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></a></div><div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-3"><a href="/templates" class="group min-h-44 overflow-hidden rounded-xl border bg-card p-4 hover:border-primary/50"><span aria-hidden="true" class="block h-20 border-b bg-[linear-gradient(150deg,#f4efe3_0_47%,#17372f_48%_52%,#d9c29c_53%)] transition group-hover:scale-[1.02]"></span><span class="mt-5 block text-xs text-muted-foreground">0<!-- -->1<!-- --> · <!-- -->names</span><span class="mt-1 block font-semibold">Centered name</span></a><a href="/templates" class="group min-h-44 overflow-hidden rounded-xl border bg-card p-4 hover:border-primary/50"><span aria-hidden="true" class="block h-20 border-b bg-[linear-gradient(150deg,#f4efe3_0_47%,#17372f_48%_52%,#d9c29c_53%)] transition group-hover:scale-[1.02]"></span><span class="mt-5 block text-xs text-muted-foreground">0<!-- -->2<!-- --> · <!-- -->wedding</span><span class="mt-1 block font-semibold">Wedding invitation</span></a><a href="/templates" class="group min-h-44 overflow-hidden rounded-xl border bg-card p-4 hover:border-primary/50"><span aria-hidden="true" class="block h-20 border-b bg-[linear-gradient(150deg,#f4efe3_0_47%,#17372f_48%_52%,#d9c29c_53%)] transition group-hover:scale-[1.02]"></span><span class="mt-5 block text-xs text-muted-foreground">0<!-- -->3<!-- --> · <!-- -->logo</span><span class="mt-1 block font-semibold">Logo concept</span></a><a href="/templates" class="group min-h-44 overflow-hidden rounded-xl border bg-card p-4 hover:border-primary/50"><span aria-hidden="true" class="block h-20 border-b bg-[linear-gradient(150deg,#f4efe3_0_47%,#17372f_48%_52%,#d9c29c_53%)] transition group-hover:scale-[1.02]"></span><span class="mt-5 block text-xs text-muted-foreground">0<!-- -->4<!-- --> · <!-- -->tattoo</span><span class="mt-1 block font-semibold">Tattoo reference</span></a><a href="/templates" class="group min-h-44 overflow-hidden rounded-xl border bg-card p-4 hover:border-primary/50"><span aria-hidden="true" class="block h-20 border-b bg-[linear-gradient(150deg,#f4efe3_0_47%,#17372f_48%_52%,#d9c29c_53%)] transition group-hover:scale-[1.02]"></span><span class="mt-5 block text-xs text-muted-foreground">0<!-- -->5<!-- --> · <!-- -->islamic art</span><span class="mt-1 block font-semibold">Geometric art layout</span></a><a href="/templates" class="group min-h-44 overflow-hidden rounded-xl border bg-card p-4 hover:border-primary/50"><span aria-hidden="true" class="block h-20 border-b bg-[linear-gradient(150deg,#f4efe3_0_47%,#17372f_48%_52%,#d9c29c_53%)] transition group-hover:scale-[1.02]"></span><span class="mt-5 block text-xs text-muted-foreground">0<!-- -->6<!-- --> · <!-- -->social post</span><span class="mt-1 block font-semibold">Social square</span></a></div></div></div></section><section class="border-y bg-card px-4 py-20 sm:px-6"><div class="mx-auto grid max-w-[1240px] gap-5 md:grid-cols-3"><article class="border-l-2 border-primary/30 pl-5"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-lock text-primary" aria-hidden="true"><path d="M5 13a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v6a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2v-6"></path><path d="M11 16a1 1 0 1 0 2 0a1 1 0 0 0 -2 0"></path><path d="M8 11v-4a4 4 0 1 1 8 0v4"></path></svg><h2 class="mt-5 font-semibold">Local-first privacy</h2><p class="mt-2 text-sm leading-6 text-muted-foreground">No account, checkout, or cloud project is required. Your current artwork stays in your browser.</p></article><article class="border-l-2 border-primary/30 pl-5"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-language text-primary" aria-hidden="true"><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><h2 class="mt-5 font-semibold">Honest language guidance</h2><p class="mt-2 text-sm leading-6 text-muted-foreground">The Studio shapes what you enter but never presents automatic spelling as reviewed Arabic.</p></article><article class="border-l-2 border-primary/30 pl-5"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-license text-primary" aria-hidden="true"><path d="M15 21h-9a3 3 0 0 1 -3 -3v-1h10v2a2 2 0 0 0 4 0v-14a2 2 0 1 1 2 2h-2m2 -4h-11a3 3 0 0 0 -3 3v11"></path><path d="M9 7l4 0"></path><path d="M9 11l4 0"></path></svg><h2 class="mt-5 font-semibold">Font license records</h2><p class="mt-2 text-sm leading-6 text-muted-foreground">Download a plain-text summary with font family, version, source, and license URL.</p></article></div></section><section class="px-4 py-20 sm:px-6" id="faqs"><div class="mx-auto grid max-w-[1050px] gap-10 lg:grid-cols-[0.55fr_1.45fr]"><div><p class="text-xs font-semibold uppercase tracking-[0.16em] text-primary">FAQ</p><h2 class="mt-3 text-4xl font-semibold tracking-[-0.04em]">Before you export</h2></div><div class="border-t"><details class="group border-b py-5"><summary class="cursor-pointer list-none pr-8 font-semibold">Does it handle Arabic joining and RTL correctly?</summary><p class="mt-3 max-w-[70ch] text-sm leading-6 text-muted-foreground">Yes. HarfBuzz shapes visual runs, bidi-js resolves mixed direction, and OpenType outlines provide every glyph path. The source string is never reversed.
93</p></details><details class="group border-b py-5"><summary class="cursor-pointer list-none pr-8 font-semibold">Which export formats are free?</summary><p class="mt-3 max-w-[70ch] text-sm leading-6 text-muted-foreground">PNG, path-based SVG, and PDF are available without an account. SVG does not contain text or require the font to be installed.</p></details><details class="group border-b py-5"><summary class="cursor-pointer list-none pr-8 font-semibold">Can I use the font output commercially?</summary><p class="mt-3 max-w-[70ch] text-sm leading-6 text-muted-foreground">The first 12 fonts use the SIL Open Font License. The License page links each original source, font version, and OFL record.</p></details><details class="group border-b py-5"><summary class="cursor-pointer list-none pr-8 font-semibold">Does the Studio check spelling or meaning?</summary><p class="mt-3 max-w-[70ch] text-sm leading-6 text-muted-foreground">No. The Studio shapes what you enter but does not translate or proofread it. Ask a native speaker before a tattoo, logo, engraving, or memorial use.</p></details><details class="group border-b py-5"><summary class="cursor-pointer list-none pr-8 font-semibold">Is my artwork uploaded?</summary><p class="mt-3 max-w-[70ch] text-sm leading-6 text-muted-foreground">Editing, autosave, and export run locally in your browser. The current release has no account system and does not upload your artwork.</p></details></div></div></section><section class="px-4 pb-24 sm:px-6"><div class="mx-auto flex max-w-[1240px] flex-col items-start justify-between gap-6 rounded-2xl bg-[#102f28] p-8 text-[#fbf7ed] sm:flex-row sm:items-center sm:p-10"><div><h2 class="text-3xl font-semibold tracking-[-0.035em]">Start with the text you already have.</h2><p class="mt-2 text-sm text-white/60">Shape it correctly, keep it editable, and export the same paths.</p></div><a href="/studio" class="inline-flex min-h-11 shrink-0 items-center gap-2 rounded-lg bg-[#fbf7ed] px-5 text-sm font-semibold text-[#102f28] hover:bg-white">Open the Studio<svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" 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 " aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></a></div></section></div>
93<script></script>
93<!--/$--></main><footer class="border-t"><div class="container mx-auto max-w-7xl px-4"><div class="grid grid-cols-2 gap-8 py-16 md:grid-cols-6"><div class="col-span-full flex flex-col items-start md:col-span-2"><div class="flex items-center space-x-2"><img src="/brand-mark.svg" alt="Arabic Calligraphy Studio logo" class="size-8 rounded-md dark:hidden" width="32" height="32" decoding="async"/><img src="/brand-mark.svg" alt="Arabic Calligraphy Studio logo" class="size-8 rounded-md hidden dark:block" width="32" height="32" decoding="async"/><span class="text-xl font-semibold">Arabic Calligraphy Studio</span></div><p class="text-muted-foreground text-base py-2 md:pr-12">Correct Arabic shaping, local editing, and free path-based exports.</p></div><div class="col-span-1 md:col-span-1 flex flex-col items-start"><span class="text-sm font-semibold uppercase">Product</span><ul class="mt-4 list-inside space-y-3"><li><a href="/studio" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Studio</a></li><li><a href="/templates" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Templates</a></li><li><a href="/fonts" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Fonts</a></li></ul></div><div class="col-span-1 md:col-span-1 flex flex-col items-start"><span class="text-sm font-semibold uppercase">Resources</span><ul class="mt-4 list-inside space-y-3"><li><a href="/how-arabic-shaping-works" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">How shaping works</a></li><li><a href="/license" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Font license</a></li></ul></div><div class="col-span-1 md:col-span-1 flex flex-col items-start"><span class="text-sm font-semibold uppercase">Safety</span><ul class="mt-4 list-inside space-y-3"><li><a href="/templates/tattoo" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Tattoo review guide</a></li><li><a href="/privacy" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Privacy</a></li></ul></div><div class="col-span-1 md:col-span-1 flex flex-col items-start"><span class="text-sm font-semibold uppercase">Legal</span><ul class="mt-4 list-inside space-y-3"><li><a href="/terms" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Terms</a></li><li><a href="/cookie" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Cookie policy</a></li></ul></div></div></div><div class="border-t py-8"><div class="container mx-auto max-w-7xl px-4 flex flex-col items-center justify-between gap-4 sm:flex-row"><span class="text-muted-foreground text-sm">© <!-- -->2026<!-- --> <!-- -->Arabic Calligraphy Studio<!-- -->.<!-- --> <!-- -->All Rights Reserved</span><span class="text-sm text-muted-foreground">No account. No uploads. No watermark.</span></div></div></footer></div><section aria-label="Notifications alt+T" tabindex="-1" aria-live="polite" aria-relevant="additions text" aria-atomic="false"></section>
93<script class="$tsr" id="$tsr-stream-barrier">(self.$R=self.$R||{})["tsr"]=[];self.$_TSR={h(){this.hydrated=!0,this.c()},e(){this.streamEnded=!0,this.c()},c(){this.hydrated&&this.streamEnded&&(delete self.$_TSR,delete self.$R.tsr)},p(e){this.initialized?e():this.buffer.push(e)},buffer:[]}; 94;$_TSR.router=($R=>$R[0]={manifest:$R[1]={routes:$R[2]={__root__:$R[3]={preloads:$R[4]=["/assets/main-CAlPfnCw.js"],assets:$R[5]=[$R[6]={tag:"script",attrs:$R[7]={type:"module",async:!0},children:"import(\"/assets/main-CAlPfnCw.js\")"}]},"/":$R[8]={preloads:$R[9]=["/assets/index-TqwRL_ec.js","/assets/use-shape-worker-LzHjpdjT.js","/assets/svg-DJjHET4h.js","/assets/registry-I7h79uUO.js","/assets/IconLoader2-BW8fIxNM.js","/assets/IconArrowRight-BI-fCxwy.js","/assets/font-preview-C2ULUkLg.js","/assets/IconVectorBezier2-gTXwLeb4.js","/assets/IconLock-ByfRZaai.js"]}}},matches:$R[10]=[$R[11]={i:"__root__/",u:1791228611287,s:"success",ssr:!0},$R[12]={i:"//",u:1791228611287,s:"success",ssr:!0}],lastMatchId:"//",dehydratedData:$R[13]={queryStream:$R[14]=($R[15]=(e) => new ReadableStream({ start: (r) => { 95 e.on({ next: (a2) => { 96 try { 97 r.enqueue(a2); 98 } catch (t) { 99 } 100 }, throw: (a2) => { 101 r.error(a2); 102 }, return: () => { 103 try { 104 r.close(); 105 } catch (a2) { 106 } 107 } }); 108} }))($R[16]=($R[17]=() => { 109 let e = [], r = [], t = true, n2 = false, a2 = 0, s = (l, g, S) => { 110 for (S = 0; S < a2; S++) r[S] && r[S][g](l); 111 }, i = (l, g, S, d) => { 112 for (g = 0, S = e.length; g < S; g++) d = e[g], !t && g === S - 1 ? l[n2 ? "return" : "throw"](d) : l.next(d); 113 }, u = (l, g) => (t && (g = a2++, r[g] = l), i(l), () => { 114 t && (r[g] = r[a2], r[a2--] = void 0); 115 }); 116 return { __SEROVAL_STREAM__: true, on: (l) => u(l), next: (l) => { 117 t && (e.push(l), s(l, "next")); 118 }, throw: (l) => { 119 t && (e.push(l), s(l, "throw"), t = false, n2 = false, r.length = 0); 120 }, return: (l) => { 121 t && (e.push(l), s(l, "return"), t = false, n2 = true, r.length = 0); 122 } }; 123})())}})($R["tsr"]);document.currentScript.remove()</script>
123<script type="module" async="">import("/assets/main-CAlPfnCw.js")</script>
123<script>($R=>$R[16].return(void 0))($R["tsr"]);$_TSR.e();document.currentScript.remove()</script>
123</body></html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.