Skip to content
MENU

Soracom

Design System

Typography

The Soracom Design System uses Aeonik, Source Sans, Source Han Sans and Source Code fonts throughout.

Overview 

Source Pro Fonts 

The Source Pro fonts are an open-source font family from Adobe and are the primary font used throughout the Soracom Design System. It has been chosen for its variable font weight support, Japanese language support and matching mono-space versions. It is a modern and flexible typeface optimized for online and user interface applications.

For both English and Japanese languages SDS includes and uses a single custom subset version of Source Han Sans Variable font hosted on the SDS Assets content delivery network. This provides better character size consistency than using both Source Sans Pro and Source Han Sans (due to character size differences).

空色 Sky blue
空色 Sky blue
Downloads

For use outside of SDS, the latest versions of the fonts can be downloaded directly:

For additional font downloads – including different file formats and non-variable font versions – see the Adobe Fonts github repositories for Source Sans, Source Han Sans and Source Code Pro

Webfonts

If you are not importing the SDS NPM, CSS or SCSS files already, you can import the required fonts using the following css:

@import url("https://assets.soracom.io/fonts/source-han-sans/SourceHanSansJP-VF.css");
@import url("https://assets.soracom.io/fonts/source-code/SourceCode-VF.css");

body {
  font-family: 'Source Han Sans JP', Arial, Helvetica, sans-serif;
}

code, pre {
  font-family: 'Source Code', monospace;
}

Aeonik 

Aeonik is our ESM primary brand font. It’s been chosen for its modern, simple and technical qualities. As Aeonik does not support Japanese characters, Aeonik is only used for larger headings in SDS and will automatically be replaced with Source Hans Sans JP for any Japanese characters.

空色 Sky blue
空色 Sky blue
Downloads

TBA

Webfonts

If you are not importing the SDS NPM, CSS or SCSS files already, you can import the required fonts using the following css:

@import url("https://assets.soracom.io/fonts/aeonik/Aeonik.css");
@import url("https://assets.soracom.io/fonts/source-han-sans/SourceHanSansJP-VF.css");

h1, h2, h3, h4, h5, h6 {
  font-family: Aeonik, 'Source Han Sans JP', Arial, Helvetica, sans-serif;
}

Font samples 

Source Han Sans JP

速い茶色のキツネ

スペインの雨は主に平原に降ります

IoTおよびM2M用に構築されたグローバルマルチキャリアセルラー接続。 IoTネットワークとデバイスの管理とセキュリティ保護に必要なコミットメントとすべてのツールを使用せずに、支払いを行います。

Font Weight
Font Size
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z Ă Â Ê Ô Ơ Ư ă â ê ô ơ ư 1 2 3 4 5 6 7 8 9 0 西 ? ! ( % ) [ # ] { @ } / & \ < - + ÷ × = > ® © $ £ ¥ ¢ : ; , . * §
Source Code Pro

AaBbCcDdEe

1234567890

Global multicarrier cellular connectivity built for IoT & M2M. Pay as you go with no commitments and all the tools you need to manage and secure your IoT network and devices.

Font Weight
Font Size
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z Ă Â Ê Ô ă â ê ô 1 2 3 4 5 6 7 8 9 0 ? ! ( % ) [ # ] { @ } / & \ < - + ÷ × = > ® © $ £ ¥ ¢ : ; , . * §
Aeonik

AaBbCcDdEe

1234567890

Global multicarrier cellular connectivity built for IoT & M2M. Pay as you go with no commitments and all the tools you need to manage and secure your IoT network and devices.

Font Weight
Font Size
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z Ă Â Ê Ô ă â ê ô 1 2 3 4 5 6 7 8 9 0 ? ! ( % ) [ # ] { @ } / & \ < - + ÷ × = > ® © $ £ ¥ ¢ : ; , . * §