厳選・オープン・無料

Redis

Redisは、本番環境で信頼性の高いAIエージェントを構築するためのリアルタイムコンテキストレイヤーを提供します。

devdb
Redis のスクリーンショット
↓ デザインシステムをダウンロード (7 MB)OpenDesign で開く

オリジナル: https://redis.io

📦 パックの中身を見る →

01

デザイン DNA

インフラストラクチャAIエージェントコンテキストエンジンパフォーマンスデベロッパーファースト

モダンなAIアプリケーションのための高性能データバックボーン

02

カラー

#FF4438Accent
#FFFFFFInk
#B9C2C6Ink soft
#0D212CBG
#163341BG soft
#091A23BG quiet
#8A99A0Muted
rgba(255,255,255,0.15)Line

深い暗い背景が、ビビッドなブランドアクセントと明確で読みやすい白いテキストのためのハイコントラストなキャンバスを提供します。

03

タイポグラフィ

condensed-sans · geometric-sans · monospace

インパクトの大きい大きな見出しには、コンデンセッドサンセリフを使用します。 · 本文テキストとUI要素には、ジオメトリックサンセリフを使用します。 · 技術プロンプトとコードスニペットには、モノスペースを使用します。

04

余白

4px
8px
16px
24px
32px
48px
64px
96px

一貫した4pxグリッドと、セクション区切りのためのゆったりとした垂直パディング。

05

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

sm · 4px
md · 8px
lg · 10px
pill · 999px

1px solid rgba(255,255,255,0.15)

rgba(0,0,0,0.1) 0px 0px 20px 0px

06

レイアウト

1280container
12columns
24pxgutter
768 / 1024breakpoints

目立つヒーロー、その後にフィーチャーセクションと技術図解が続く中心配置レイアウト。

07

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

200msmicro
300mssmall
500msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing

コンテンツブロックへの控えめなフェードイン。 · インタラクティブ要素の滑らかなカラーと不透明度のトランジション。 · ホバー状態でコンポーネントをわずかに明るくしたり、浮き上がらせたりする。

ボタンやリンクの控えめな背景色の変化や明度の調整。 · わずかな押し込みや不透明度の変化による即座のフィードバック。

08

コンポーネント

09

文体と禁止事項

10

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

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

11

System Prompt

Redisウェブサイトは、深い暗い背景(#0D212C)、ハイコントラストの白いテキスト(#FFFFFF)、ビビッドなレッドアクセント(#FF4438)を使用した開発者向けプラットフォームです。タイポグラフィは、太字でインパクトの大きい見出しのためのコンデンセッドサンセリフと、明確な本文テキストのためのジオメトリックサンセリフ、技術プロンプトのためのモノスペースを組み合わせています。レイアウトはクリーンで中心配置であり、大きなヒーローセクション、技術図解、明確なCTAボタンを特徴としています。重要なデザインルール:明るい背景を絶対に使用しない、装飾フォントを避ける、ハイコントラストを維持する、見出しにはコンデンセッドタイプを使用する、明確なボーダーでコンポーネントを分離する。このデザインは、AI開発のための技術的権威と現代的なインフラストラクチャを効果的に伝えています。

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

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

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

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