webatlaのブランドを、 そのものに適用する
マークをダウンロードし、パレットをコピーし、ルールを確認してください。このページのすべては、ここに記載されたガイドラインに従っています。
{"brand": "webatla", "case": "lowercase", "mark": "cloud-on-data", "primary": "#13715b", "accent": "#cc3366", "fonts": "system", "since": 2019}マーク
2つに分かれたターコイズの雲が、5つの濃色のドットが並ぶ明るいデータパネルの上に載っています。構造化データの行の上に座るウェブの雲です。512の正方形の中にフラットに描かれ、グラデーションは使用していません。
viewBox: 512x512 · 形式: フラットSVG · 背景: 白、ソフトグレー、ネイビー、ソフトターコイズ
このページのすべてのファイルを1つのアーカイブにまとめ、パレットを記載したREADMEも同梱しています。ダウンロードするファイルを1つだけ選ぶなら、これにしてください。
webatla-mark.svgSVG · ベクターベクター形式のプライマリロゴマークです。ウェブ、プロダクト、印刷のデフォルトの選択肢です。劣化なくどんなサイズにも拡大縮小できます。
webatla-mark-512.pngPNG · 512
512×512のラスター書き出し、透過です。アバターやチャットツールなど、SVGが使えない場面向けです。
webatla-mark-1024.pngPNG · 1024
1024×1024のラスター書き出し、透過です。プレスキットや大きな掲載箇所向けです。
webatla-mark-mono.svgSVG · mono
クラウドの単色シルエットです。ピン留めタブや刻印、単色印刷向けです。任意のブランドカラー1色で着色できます。
マーク、ロックアップ、モノクロ
3つの形式であらゆる配置に対応します。使えるスペースと印刷できる色に応じて選んでください。
webatla
マーク単体
スペースが限られている場合や、名前がすでに近くに表示されている場合に使用します。アプリアイコン、アバター、ソーシャルプロフィール、ファビコンなどです。
ロックアップ
マークと、ウェイト800の太さで組んだ小文字のwebatla、インク色#303642、間隔を詰めた組み合わせです。マークに名前が必要なヘッダー、文書、スライドで使用します。
ワードマークはシステムフォントです
webatlaはプライバシーとパフォーマンスのため、webフォントを配信しません。ワードマークは閲覧者のUIネイティブフォントで表示されます。プラットフォームごとに多少の違いが生じますが、これは意図した設計であり、崩れではありません。
モノクロマーク
使用できる色が1色のみの場合に使用します。任意のブランドカラー1色で着色してください。フルカラーのマークに単色の着色を適用することは絶対にしないでください。
クリアスペースと最小サイズ
覚えておくべき数字は2つです。余白はドット1つ分、サイズは24ピクセルです。
最小サイズ: 画面上で24px
24ピクセルを下回ると、5つのドットが融合してしまいます。小さなスペースにはモノクロのシルエットを使用してください。
ロゴマーク内の正方形のドット1つ分の高さを測ります。四辺すべてに、その分の余白を確保してください。このゾーンには何も入れません。テキストも、他のロゴも、キャンバスの端も同様です。
カラー
実務で使うパレットは意図的に少数に絞っています。スウォッチをクリックすると16進コードをコピーできます。
マークカラー (変更しないでください。UIカラーとして再利用しないでください。)
タイポグラフィ
原則としてウェブフォントは使用しません。テキストは閲覧者自身のシステムスタックで表示されるため、ページは高速に保たれ、リクエストも非公開のままです。
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789
役割: 見出しとUI · スタック: システムサンセリフ · ウェイト: 見出しは700〜800、本文は400
役割: データ、ファイル名、16進数、コード · スタック: システムモノスペース · 表内の数字はモノスペースを使用し、列を揃えています。
ブランド素材にはこの2つのスタックのみを使用します。ディスプレイフォント、スクリプト体、ダウンロードはありません。
禁止事項
ロゴマークを壊す6つの例です。各カードでは実際のファイルをその場で誤用して表示しているので、間違いを見分けられます。
色の変更禁止
フルカラーのロゴマークは、決められた5色で提供されます。どれも変更しないでください。
引き伸ばし禁止
viewBoxは正方形です。正方形のまま保ってください。均等に拡大縮小し、枠に無理やり合わせないでください。
回転禁止
クラウドはパネルの上に水平に配置されます。角度は常に0度です。
エフェクト追加禁止
ロゴマークはフラットです。影も、輪郭線も、グロー効果も、グラデーションも付けません。
フルカラーのロゴマークへの着色禁止
色を付けられるのはモノクロ版のロゴマークのみで、一度に使えるブランドカラーも1色だけです。
新登場!詰め込み禁止
1ドット分のクリアスペースを守ってください。テキストやバッジ、端はその外側に配置します。
また、決して描き直さないでください。トレースも、再構築も、近似も禁止です。使用できるのはこのページのファイルのみです。
名前
どこでも、小文字の1語で。
常に小文字
webatlaは文頭であっても、常に小文字の1語で表記します。Webatla、WebAtla、Web Atlaとは表記しません。
説明する一文
インターネット全体を1つのJSONLファイルに。プレスやパートナーページにはこのフレーズをそのまま使用してください。
会社について
webatlaはサイバーセキュリティとドメインデータを扱う小さな会社で、2019年から事業を続けています。「小さい」と言って構いません。それが正確な表現です。
キット一式を手に入れましょう
このページのすべてのマークを1つのアーカイブにまとめ、パレットを記載したREADMEも同梱しています。ここに記載のない用途については、独自に判断する前にお問い合わせください。