厳選・オープン・無料
Slite
チームの現実と同期し正確性を維持する、AI搭載のナレッジベース。
SaaSAIProductivityCleanCalm
01
デザイン DNA
ナレッジ検証済み同期正確性信頼性
チームの集合知を整理し信頼できる図書館のような存在。
02
カラー
#F67748Accent
#3F434AInk
#2D2F34Ink soft
#FDF9F4BG
#FFFFFFBG soft
#A8AAAFMuted
rgba(244,244,244,1.0)Line
温かみのあるハイコントラストの中性色が親しみやすくプロフェッショナルな印象を創出し、プライマリアクションには鮮やかなオレンジを一点だけ使用します。
03
タイポグラフィ
humanist-sans · geometric-sans
- display
56px · 600 - h1
36px · 600 - body
16px · 400 - small
13px · 400
プライマリおよびセカンダリの見出しにはdisplayとh1トークンを使用し、視覚的な階層を維持します。 · 本文テキストには一貫した行の高さ1.6を維持し、可読性を確保します。 · ナビゲーションやバッジなどのUI要素にはsmallトークンを使用し、目立たないようにします。
04
余白
4px
8px
12px
16px
24px
32px
48px
64px
96px
120px
4pxのベースグリッドと、主要セクションに広めのパディング(120px)を用いた、開放的で息の良いレイアウト。
05
サーフェス (角丸 / 影 / 罫線)
sm · 6px
md · 10px
lg · 16px
pill · 999px
1px solid rgba(244,244,244,1.0)
rgba(0, 0, 0, 0.3) 0px 32px 68px 0px · rgba(0, 0, 0, 0.06) 0px 1px 0px 0px
06
レイアウト
1280container
12columns
24pxgutter
768 / 1024breakpoints
中央揃えの単一カラムヒーローの下に3カラムの機能グリッドを配置。
07
モーションとインタラクション
220msmicro
400mssmall
800msmedium
cubic-bezier(0.215, 0.61, 0.355, 1)easing
ページ読み込みやスクロールトリガー要素に対する、繊細なフェードインおよびスライドアップアニメーション。 · ボタンやインタラクティブ要素に対するスムーズなホバートランジション。
ボタンやリンクにおける、微細な背景色の変化またはシャドウの増加。 · 即座のビジュアルフィードバック(例:ボタンの押下や色の変化)。
08
コンポーネント
- button ピル型でハイコントラストのプライマリボタン(オレンジ背景、白テキスト)とゴーストボタン(アウトライン付き)。
- card 見出しやリストを含む、微細なシャドウまたはアウトラインを持つ明るい背景のカード。
- chip 「検証済み」「セルフメンテナンス」などのアイコン付きピル型タグと、穏やかな背景色。
- input 微細なボーダーと角丸を持つ、クリーンでミニマルな検索またはインプットフィールド。
- hero サブヘッドライン、プライマリCTAボタン、信頼バッジ(SOC 2、HIPAA、GDPR)を伴う、大きく中央揃えの見出し。
09
文体と禁止事項
- トーン 正確性と信頼性に焦点を当てた、自信に満ちた、明確で有益なトーン。
- 見出し 能動態を用いた、直接的でベネフィット重視、ややフォーマルなスタイル。
- CTA 行動を促す励ましのスタイル(例:「ドキュメントを最新に保ちましょう」)。
- 純粋な白背景は使用しない — スクリーンショットではプライマリキャンバスとして温かみのあるオフホワイト(#FDF9F4)が使われている。
- オレンジ以外のプライマリアクセントカラーは使用しない — スクリーンショットではCTAに単一の鮮やかなオレンジ(#F67748)が使われている。
- 見出しにセリフフォントは使用しない — スクリーンショットでは一貫してクリーンなヒューマニストサンセリフが使われている。
- 主要コンポーネントにシャープで角張ったコーナーは使用しない — スクリーンショットでは一貫して角丸(6pxからピル型)が使われている。
- ヒーローセクションに密集したマルチカラムレイアウトは使用しない — スクリーンショットではゆったりとした中央揃えの単一カラムアプローチが使われている。
- ダークモードや高彩度のカラーバックグラウンドは使用しない — スクリーンショットでは明るく空気感のある中性パレットが維持されている。
- 避ける: 過大な主張
- 避ける: 専門用語の説明
- 避ける: 攻撃的または押し売りのような言葉
10
パック内の実スクリーンショット
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(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
Sliteは、チーム向けの信頼できるAI搭載のナレッジベースとしてポジショニングするB2B SaaSプロダクトです。デザインはクリーンでプロフェッショナルかつ親しみやすく、温かみのあるオフホワイト(#FDF9F4)の背景、ダークグレー(#FDF9F4)のテキスト、プライマリアクションには単一の鮮やかなオレンジ(#F67748)のアクセントを使用しています。タイポグラフィはクリーンなヒューマニストサンセリフファミリー(例:UniversalSans)で、見出しには大きく太字のdisplayフォントを採用。レイアウトはゆったりと中央揃えで、広めのパディングと機能のための3カラムグリッドを用いています。重要な禁止事項:メインキャンバスに純粋な白背景は絶対に使用しない;プライマリアクセントカラーは1色以上追加しない;displayテキストにセリフフォントは絶対に使用しない;カードやボタンのシャープな角は回避;十分な余白のない密集レイアウトは作成しない;見出しに攻撃的または過大な主張の言葉は使用しない。
en · zh-CN · zh-TW · ja · ko