厳選・オープン・無料

Atlantistech

高リスクの組織変革を担う、エリートオペレーター。

SaaSProductivityDark ModePremiumBold Typography

Atlantistech のスクリーンショット

↓ デザインシステムをダウンロード (13 MB)OpenDesign で開く

オリジナル: https://www.atlantistech.com

📦 パックの中身を見る →

01

デザイン DNA

変革野心オペレーター結果頂点

遠征を導く熟練した山岳ガイド

02

カラー

#F7931AAccent

#FFFFFFInk

rgba(255,255,255,0.7)Ink soft

#12151CBG

rgba(255,255,255,0.5)Muted

rgba(255,255,255,0.1)Line

重要アクションに鮮やかなオレンジを使用した、ハイコントラストダークモード。

03

タイポグラフィ

geometric-sans · humanist-sans

display56px · 700

04

余白

4px

8px

16px

24px

32px

48px

64px

96px

一貫した4pxグリッドと豊かな縦方向のpadding。

05

サーフェス (角丸 / 影 / 罫線)

sm · 4px

md · 8px

lg · 16px

pill · 999px

控えめなrgba(255,255,255,0.1)のborderと1pxの区切り線。

06

レイアウト

1280container

12columns

24pxgutter

768 / 1024breakpoints

単一カラムのヒーロー、2カラムの統計グリッド。

07

モーションとインタラクション

200msmicro

300mssmall

500msmedium

cubic-bezier(0.25, 0.1, 0.25, 1.0)easing

hover時のカラートランジション · 控えめな背景のシフト

リンクとボタンのカラートランジション · 直接ナビゲーション

08

コンポーネント

button ソリッドプライマリ（オレンジ）とゴーストセカンダリ（透明、border付き）。
card 控えめなborderベースのカード、豊かなpadding。
chip 左揃えのカラードット付きステータスピル。
hero 太字のタイポグラフィと抽象的なワイヤーフレームグラフィックを用いた、フルハイトのダークセクション。

09

文体と禁止事項

トーン 権威があり、経験豊かで、率直
見出し 戦略的な言葉の強調を用いた、自信に満ちた力強いスタイル。
CTA 矢印インジケーター付きの、明確で行動指向のスタイル。

遊び心のあるイラストは使用しない — スクリーンショットは洗練された、ミニマルなダークインターフェースを示している
明るい背景は使用しない — スクリーンショットは深いダークネイビー/ブラックの基盤を示している
レインボーグラデーションは使用しない — スクリーンショットは厳密に限定された2色のアクセントパレットを使用している
細くて繊細なタイポグラフィは使用しない — スクリーンショットは太字でインパクトの強いディスプレイウェイトを示している
過度なborderは使用しない — スクリーンショットは透明度ベースの控えめなエッジを使用している
本文に中央揃えのテキストは使用しない — スクリーンショットはクリーンな、左揃えの読書カラムを示している
避ける: 一般論のバズワード
避ける: 受動的な言葉遣い
避ける: 視覚的な雑踏
避ける: 過度に遊び心のある要素
避ける: 明るいマルチカラーパレット

10

パック内の実スクリーンショット

Atlantistech — 桌面首屏（hero） — 桌面首屏（hero）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Atlantistech — 移动首屏 — 移动首屏

実ページから取得 · 実 computed styles

11

System Prompt

Atlantisは、経営層をターゲットとしたプレミアムな高リスクコンサルティング企業です。そのデザインDNAは、深いネイビー/ブラック（#12151C）の背景と、重要なアクションに使用される鮮やかなオレンジ（#F7931A）のアクセントで定義されています。タイポグラフィは、幾何学的サンセリフとヒューマニストサンセリフ（Inter, Space Grotesk）を組み合わせ、精密さと親しみやすさのバランスを取っています。重要なデザイン制約には、遊び心のある風変わりなイメージの不使用、ライトモード背景の不使用、過度に装飾的な要素の不使用が含まれます。声調は権威的で率直であり、複雑な変革を担うエリートオペレーターのチームとしてサービスを位置づけています。

このセンスを AI エージェントへ

この設計の機械可読な仕様——カラー・タイポ・モーションまで——をそのまま AI エージェントに渡せます。

OpenDesign スキル ↗ · このパック（エージェント用） ↗

en · zh-CN · zh-TW · ja · ko