← OpenDesign 厳選・オープン・無料
AssemblyAI
開発者のためのクリーンでプロフェッショナルな音声AIインフラストラクチャ
ai voice
01
デザイン DNA
インフラストラクチャ 音声 開発者 精度
音声アプリケーション構築のための精密ツール
02
カラー
#3923C7Accent
#1D1B16Ink
#4A4945Ink soft
#FDFCF8BG
#F5F3EBBG soft
#777673Muted
rgba(74, 73, 69, 0.15)Line
清潔で高コントラストなベースに、プライマリアクション用の大胆なアクセントを1色配置。
03
タイポグラフィ
transitional-serif · geometric-sans · monospace
display 64px · 400body 16px · 400mono 14px · 400大きなディスプレイ見出しにはトランジショナルセリフを使用 · 本文とナビゲーションにはジオメトリックサンセリフを使用 · コードスニペットと技術UI要素にはモノスペースを使用
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
一貫した8pxベースグリッドと、明瞭さのためのゆったりとした余白。
05
サーフェス (角丸 / 影 / 罫線)
sm · 2px
md · 4px
lg · 8px
pill · 999px
控えめで薄いボーダーを使用。容器を定義しつつも重さを感じさせない、穏やかなダークカラー。
0px 4px 20px 4px rgba(29, 27, 22, 0.12)
06
レイアウト
1280 container
12 columns
24px gutter
768 / 1024 breakpoints
ゆったりとした余白と、ナビゲーション、ヒーロー、コンテンツセクション間に明確な階層構造。
07
モーションとインタラクション
220ms micro
400ms small
800ms medium
cubic-bezier(0.4, 0, 0.2, 1) easing
インタラクティブ要素のhoverおよびfocus時の微細なトランジション · UIコンポーネントのスムーズな状態変化
ボタンとナビゲーションリンクの微細な色または不透明度の変化。 · 状態変化による即座の視覚フィードバック。
08
コンポーネント
button 大胆で大文字のボタン。塗りつぶし（アクセント）とアウトラインのバリアント間で高いコントラストを実現。 card 薄いボーダーと控えめなシャドウを備えたクリーンなコンテナ。インタラクティブまたは技術的なコンテンツを収容。 chip APIカテゴリ用の大文字モノスペースラベル。薄いボーダー付き。 input クリーンなボーダーを備えたミニマルなスタイリング。機能性に焦点。 hero 大胆なセリフ体の大型見出し。簡潔なサンセリフのサブテキストと明確なCTAを配置。 09
文体と禁止事項
トーン プロフェッショナルで権威があり、開発者に焦点を当てたもの。 見出し 規模と重要性を伝える、大型でインパクトのあるセリフ体見出し。 CTA 直接的で大文字、アクション重視。 遊び心のあるまたは角の丸いフォントを使用しない — スクリーンショットではトランジショナルセリフとジオメトリックサンセリフの組み合わせが示されています。 明るく多色のグラデーションを使用しない — スクリーンショットではクリーンでほぼ単色のパレットにアクセント1色が示されています。 要素を詰め込みすぎずインタフェースを散らかさない — スクリーンショットではゆったりとした余白と明確な階層構造が示されています。 プライマリアクションに小文字を使用しない — スクリーンショットではボタンと技術ラベルにすべて大文字が示されています。 本文に重く太いウェイトを使用しない — スクリーンショットではほとんどのテキストで一貫した400ウェイトが示されています。 複雑で重なったシャドウを使用しない — スクリーンショットでは浮遊要素に単一の控えめなボックスシャドウが示されています。 避ける: インフォーマルな言葉遣い 避ける: 過度な装飾 避ける: 曖昧な専門用語 10
パック内の実スクリーンショット
桌面首屏（hero） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 移动首屏 実ページから取得 · 実 computed styles
11
System Prompt
これは音声AIインフラストラクチャ企業のためのクリーンでプロフェッショナルなウェブサイトです。デザインでは、大きなディスプレイ見出しにトランジショナルセリフフォントを、本文テキストにジオメトリックサンセリフを使用し、洗練されながらもモダンな印象を実現しています。プライマリアクセントカラーは深い青紫（#3923C7）で、「SIGN UP FREE」や「GET STARTED」などの主要なアクションに使用されます。背景は暖かみのあるオフホワイト（#FDFCF8）で、表面の微妙な区別用に少し暗いオフホワイト（#F5F3EB）が使われています。テキストは主に非常に暗いブラウン/ブラック（#1D1B16）で高コントラストを実現。重要な注意点：遊び心のあるフォント、多色グラデーション、インタフェースの散らかりは避けてください。レイアウトはゆったりと余白を効かせ、明瞭さと技術的な精度を重視しています。
ライブラリからもっと en · zh-CN · zh-TW · ja · ko
