An essential aspect of templates will include the Keyboard. Important to point out that not every application or website design has one. If it’s your case and you want to know more before using one, you got the right place. This tutorial will teach you how to use the Keyboard feature on templates.
If the template includes the Keyboard feature, it will come in handy since you won’t have to do it on your own or search for references to do it. In addition, templates usually will give you the tool just to copy/paste, which saves us a lot of time. In this case, we selected an IOS template that includes this feature, so let’s take a look at it briefly.
NOTE: Check How to Access Templates in Figma if you don’t know how to.
The first will be to select a Template, and you can preview what kind of features include so you need to open them one by one and look for the Keyboard.
A world of possibilities opens in front of you. Inside the keyboard, the features available will include the Key Container, the Key, and the Molecules, which will contain the default Keyboard.
The Key Container literally means what contains the letter and its color. For example, when you press a letter on the keyboard, it turns a different color, and that’s how you know you pressed the letter, so this feature will provide the standard colors for the Key Container. In this case, since we chose an IOS template, you will see the standard color of the keyboard in IOS applications, how it looks when you press the letter, how it looks in dark mode, and if some options such as enter or shift have a different color too. In addition, the Key feature will have a similar function, showing how some special characters will look.
And finally, we have the Molecules. This feature will provide the whole keyboard for you to copy and paste. In addition, it will provide Light and Dark mode, Uppercase, lowers case, symbols, and so on.
And that’s all you need to know about the Keyboard feature when using Templates in Figma. Stay tuned for more.
