- Web API
LINE Login button
The LINE Login button lets your users log in to your app or website using their LINE accounts.
The LINE Login button is made up of the following components: the LINE icon, the LINE icon speech balloon, and the LINE Login button text as shown in the image below.
Before using the LINE Login button images, make sure you read and agree to the LINE Login Button Usage Guidelines. By downloading the images, you are deemed to have agreed to the guidelines.
To use the LINE Login button, download the images contained in the archive file below. If you want to change the Login button text with a translation, use the Photoshop Document (PSD) files which are also included in the archive file.
Note: The images provided may not be used for any purpose other than as the image for the LINE Login button.
Use the following specifications for the LINE Login button.
You can enlarge or shrink the LINE Login button image according to the device it will be displayed on as long as it complies with the following rules.
- The aspect ratio of the LINE icon may not be changed.
- The visibility of the LINE icon in the LINE Login button image may not be compromised.
Only the following colors can be used for the LINE Login button image.
- Basic color: #00C300
- Hover: #00E000
- Press: #00B300
- Disabled: #C6C6C6
- Font color: #FFFFFF
It is recommended that you use “Log in with LINE” as the button text. A list of recommended phrases for other languages can be found in the table below.
If you decide to use your own customized button text, make sure to follow these guidelines:
- There are no line breaks
- The text makes it clear for the user that the button is for logging in to your service using LINE
You can also use the LINE icon on its own without any button text as the LINE Login button.
|Language||Login button text (long)||Login button text (short)|
|en||Log in with LINE||Log In|
|de||Mit LINE anmelden||Anmelden|
|es||Iniciar sesión con LINE||Iniciar sesión|
|fr||Connexion avec LINE||Se connecter|
|id||Masuk dengan LINE||Masuk|
|it||Login con LINE||Login|
|ms||Log masuk dengan LINE||Log Masuk|
|pt-BR||Login com o LINE||Login|
|pt-PT||Iniciar sessão com o LINE||Iniciar sessão|
|ru||Войти в LINE||Войти|
|tr||LINE ile oturum açın||Oturum Aç|
|ar||تسجيل دخول باستخدام LINE||تسجيل دخول|
|vi||Đăng nhập với LINE||Đăng nhập|
The font of the button text must be readable. Recommended font sizes for each image size are included in the PSD files.
The width of the right and left padding for the Login button text must be the same as or wider than that of the LINE icon speech balloon. This width is defined as X in the image below.
The recommended width of the top and bottom padding for the Login button text is X/2. Make sure you use a font size that allows for this padding width to be maintained.
The isolation zone is the space surrounding the LINE Login button which cannot contain any elements. The width of the isolation zone must be the same as or wider than the left padding of the LINE icon speech balloon. The width is defined as “A” in the image below. In addition to maintaining the isolation zone, avoid placing text or graphics near the isolation zone as that could compromise the effectiveness of the LINE Login button.
- Using a non-designated color
- Using an outdated LINE icon
- Using a different or modified icon instead of using the LINE icon