# Introduction & Tutorials

## <mark style="color:blue;">**Introduction**</mark>

<mark style="color:green;">Charm Fonts Keyboard</mark> is an iOS keyboard App which helps you to input text in various wonderful font styles, with frame styles and all kinds of decorations.  You can input styled text anywhere, Notes, IM, SMS, SNS posts... &#x20;

• 230+ Font styles\
• Customize unlimited font styles!\
• 120+ Frame styles\
• Customize unlimited frame styles!\
• 160+ Line styles\
• Customize unlimited frame styles!\
• Combining characters\
• Kaomojis\
• Symbol characters

<mark style="color:purple;">Demos:</mark>

ℂ𝕙𝕒𝕣𝕞 𝔽𝕠𝕟𝕥𝕤 𝕂𝕖𝕪𝕓𝕠𝕒𝕣𝕕 R͜͡o͜͡c͜͡k͜͡s͜͡

ℭ𝔥𝔞𝔯𝔪 𝔉𝔬𝔫𝔱𝔰 𝔎𝔢𝔶𝔟𝔬𝔞𝔯𝔡 𝕽𝖔𝖈𝖐𝖘

Cʜᴀʀᴍ Fᴏɴᴛs Kᴇʏʙᴏᴀʀᴅ 🆁🅾🅲🅺🆂

ᑕᕼᗩᖇᗰ ᖴOᑎTᔕ KᗴYᗷOᗩᖇᗪ ᖇOᙅKS

C͟͟͟͞͞͞h͟͟͟͞͞͞a͟͟͟͞͞͞r͟͟͟͞͞͞m͟͟͟͞͞͞ F͟͟͟͞͞͞o͟͟͟͞͞͞n͟͟͟͞͞͞t͟͟͟͞͞͞s͟͟͟͞͞͞ K͟͟͟͞͞͞e͟͟͟͞͞͞y͟͟͟͞͞͞b͟͟͟͞͞͞o͟͟͟͞͞͞a͟͟͟͞͞͞r͟͟͟͞͞͞d͟͟͟͞͞͞  ᖇ𐌏𐌂𐌊𐌔

💕💕💕💕💕💕💕💕\
💕 𝓖𝓸𝓸𝓭 𝓶𝓸𝓻𝓷𝓲𝓷𝓰 💕\
💕💕💕💕💕💕💕💕

✨💤💤💤💤💤✨ \
💤  G͜͡o͜͡o͜͡d͜͡ ͜͡n͜͡i͜͡g͜͡h͜͡t͜͡  💤\
&#x20;✨💤💤💤💤💤✨

༺ཌༀ࿈࿈࿈࿈࿈࿈࿈࿈࿈࿈࿈࿈࿈ༀད༻ \
&#x20; ༒   🅷🅴🅻🅻🅾   ༒\
༺ཌༀ࿈࿈࿈࿈࿈࿈࿈࿈࿈࿈࿈࿈࿈ༀད༻

⋯⋯⋯⋯⋯⋯ฅ՞•ﻌ•՞ฅ♥︎⋯⋯⋯⋯⋯⋯

💝💖💖💖💖𝐇𝐚𝐯𝐞 𝐚 𝐧𝐢𝐜𝐞 𝐝𝐚𝐲💖💖💖💖💝

꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷

💐🌿☘️🍀🍃🌿☘️🍀🍃🌿☘️🍀🍃💐

꥟̆̈٩(◕͟͞‿◕͟͞｡)۶☆̆̈ 𝐶̆̈𝑜̑̈𝑚͟𝑏͟𝑖𝑛͞𝑖𝑛͞𝑔 c⃠ℎ͟͟͟͞͞͞𝑎𝑟͟͟͟͞͞͞𝑎𝑐𝑡̾𝑒𝑟𝑠҉

## <mark style="color:blue;">Tutorials</mark>

### <mark style="color:purple;">Add keyboard in Settings</mark>

App will navigate you here when you press "<mark style="background-color:green;">Setup Now</mark>" button,  select <mark style="background-color:green;">Keyboards</mark>, then turn on two switch buttons. Make sure <mark style="background-color:green;">Allow Full Access</mark> is enabled, because the keyboard needs this permission to store some user preferences and verify Premium membership. The system prompt seems complex, but it's actually very simple and safe. We will NOT collect any personal data.

<div><figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2FN9zNM5tPHvMITxSJtuBM%2FWechatIMG35.jpg?alt=media&#x26;token=0f24fb14-9cbb-4631-a80a-0db3e505ad4b" alt=""><figcaption></figcaption></figure> <figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2F6TeKc50WK33GBHb5ikcT%2FWechatIMG36.jpg?alt=media&#x26;token=4ef2a483-30c1-4fac-ab6f-8c5caae3936b" alt=""><figcaption></figcaption></figure></div>

### <mark style="color:purple;">Typing input with keyboard</mark>

After Charm Fonts Keyboard has been enabled, you can long press the earth icon button at any input box, then select "<mark style="background-color:green;">Fonts Keyboard - Charm Fonts</mark>" in popup list. Select a font style, type on the keyboard.

<div><figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2FpXjRk0pOlJcaQ64UK4RY%2FWechatIMG34.jpg?alt=media&#x26;token=290a5311-f1ab-44e5-bab8-5952d03313b7" alt=""><figcaption></figcaption></figure> <figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2FglpzWKMFh5QaflhgZkeK%2FWechatIMG21.jpg?alt=media&#x26;token=2e0ff50b-9933-4adc-a8e7-b7b7db54a0de" alt=""><figcaption></figcaption></figure></div>

### <mark style="color:purple;">Setting font style to text</mark>

First select some text, go to the second tab. Note that the text must be plain text , which means not special characters in any font style. \
Then select a font style in the panel, the selected text will change into the according font style. Press <mark style="background-color:green;">Done</mark> to save changes.

You can <mark style="background-color:green;">long press</mark> a font style to move it <mark style="background-color:green;">to front</mark> or <mark style="background-color:green;">go to the keyboard</mark> of the font style. The favorited font will show at the front of the font panel.

<div><figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2F0YM33cY3VOR0iWqyB5JA%2FWechatIMG25.jpg?alt=media&#x26;token=69e6922c-da22-41e3-aba2-b5cdb7f21d09" alt=""><figcaption></figcaption></figure> <figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2FVJvrFWRiTpFZEgQw1dGV%2FWechatIMG22.jpg?alt=media&#x26;token=9899c0e8-adcf-49b6-bd29-cba8777f0cc1" alt=""><figcaption></figcaption></figure></div>

#### <mark style="color:blue;">Making framed text</mark>

Go to the third tab, select some text first. Then select a frame style in the panel below, the text will change into framed text. You can choose different styles to see preview, and you can adjust the <mark style="background-color:green;">Padding Slider</mark> to get different width of framed text or align frame borders.\
Don't forget to press <mark style="background-color:green;">Done</mark> button to save changes. Or you can just send it at an IM chat box without <mark style="background-color:green;">Done</mark>. &#x20;

Long press a single frame style to show context menu, you can select <mark style="background-color:green;">Move to front</mark> to adjust order.

<div><figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2FAjdhk5rZyzJNp3rPGTfA%2FWechatIMG24.jpg?alt=media&#x26;token=14bf6df6-2321-47c2-9977-ca1ba65b366d" alt="" width="375"><figcaption></figcaption></figure> <figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2FWRiKWvjilmmh8fbl5Ca0%2FWechatIMG9.jpg?alt=media&#x26;token=5b529caa-e844-4936-bb8d-14eff5b8abdd" alt="" width="375"><figcaption></figcaption></figure></div>

Press <mark style="background-color:green;">Customize</mark> to go to the App's frame styles tab. Here you can edit existing frame styles or create new one from scratch. Use your imagination to create more fancy frame styles of your own!

<div><figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2FPEaXuyXHHRBo7K86l313%2FWechatIMG10.jpg?alt=media&#x26;token=8191bb10-dcfd-477e-b682-552c79c62f61" alt=""><figcaption></figcaption></figure> <figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2Fd861oEP5DC4HEX3mlY2m%2FWechatIMG48.jpg?alt=media&#x26;token=d4d195ce-a997-41bc-b198-97ba24859a55" alt=""><figcaption><p>Frame style edit UI</p></figcaption></figure></div>

#### <mark style="color:blue;">Line styles</mark>

Select text and then select a line style, to add decorations to text.  Or you can just select a line style to create a single line of characters.

<div><figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2Fgt7KJooSDDpXFrLgXxQL%2Fscreenshot3-1-67-new.png?alt=media&#x26;token=07bf4ef3-1461-4599-bcbd-a15046e4afbf" alt="" width="375"><figcaption></figcaption></figure> <figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2Fue6WzHJnLtNTadZKtjwC%2FWechatIMG11.jpg?alt=media&#x26;token=f619a4e9-d4b6-4f1a-82b4-c5cd0327e3f5" alt="" width="375"><figcaption></figcaption></figure></div>

#### <mark style="color:blue;">Combining characters</mark>

Combining characters can be input after another character, and combine with that character to create a new character.  120+ different combining characters, you can create infinite font styles and decorations.

<figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2Fw3GfxCbFa7hY1lVIbWBM%2FWechatIMG8.jpg?alt=media&#x26;token=799038cd-86e2-43b5-b72e-81501a1e0f2d" alt="" width="375"><figcaption></figcaption></figure>

#### <mark style="color:blue;">Kaomoji</mark>

<figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2FtTdzmCryfM6gUUTNvNT2%2FWechatIMG12.jpg?alt=media&#x26;token=e3640cf5-2d6d-4751-8633-acec22272725" alt="" width="375"><figcaption></figcaption></figure>

#### <mark style="color:blue;">Special symbol characters</mark>

The 4th tab is symbol characters keyboard with 800+ symbols provided.

<div><figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2FN83EZ8S768TKyJYdTJeu%2FWechatIMG37.jpg?alt=media&#x26;token=d4f71819-f6c2-4f83-8027-127b0db46d17" alt=""><figcaption></figcaption></figure> <figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2FUVCbmHTmZmmAi3lcIsyL%2FWechatIMG38.jpg?alt=media&#x26;token=1a3d2764-d308-486b-837e-227ebde996e3" alt=""><figcaption></figcaption></figure></div>

<div><figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2FBpiexvdKPa2ojfVY32dT%2FWechatIMG39.jpg?alt=media&#x26;token=08c211dd-8eec-4feb-8817-e70aa82a6faf" alt=""><figcaption></figcaption></figure> <figure><img src="https://2190123624-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYl1WSC4Yi3TLTJy3KkY%2Fuploads%2FgnHFH1Yr6lGb5ITmafpF%2FWechatIMG40.jpg?alt=media&#x26;token=c9b9ed1f-846e-44a8-9cd9-27851da79b41" alt=""><figcaption></figcaption></figure></div>

*Please note that on other platform devices (e.g. Android, PC, etc. ), font styles and framed text may display different from iOS devices. Even on iOS devices, because some Apps may use different font from system font, so the framed text may not aligned very well in those Apps.*&#x20;

That's it, enjoy\~
