الألوان
لوحة ألوان sweetgreen.com
يبني sweetgreen.com صفحاته على خلفية #f4f3e7 بنص #0e150e ودون لون مميز واحد. الألوان الـ 5 أدناه مقاسة من الموقع الحي.
تم القياس من sweetgreen.com قبل 32 يومًا.
اللوحة
5 ألوان| الألوان | الدور | Hex | RGB |
|---|---|---|---|
background | Page background | #f4f3e7 | rgb(244 243 231) |
surface | Cards, panels, raised or recessed surfaces | #d8e5d6 | rgb(216 229 214) |
foreground | Primary text | #0e150e | rgb(14 21 14) |
muted-foreground | Secondary text, captions | #8c8c82 | rgb(140 140 130) |
border | Hairlines, dividers, input borders | #0e150e | rgb(14 21 14) |
- النص على خلفية الصفحة
- 16.62:1 · يجتاز WCAG AA
متغيرات CSS
كل لون كخاصية مخصصة مسماة بدورها. تظهر كتلة الوضع الداكن عندما يكون للموقع سمة داكنة.
:root {
--color-background: #f4f3e7;
--color-surface: #d8e5d6;
--color-foreground: #0e150e;
--color-muted-foreground: #8c8c82;
--color-border: #0e150e;
}لوكلاء الذكاء الاصطناعي
الحزمة نص عادي بلا مفتاح: اجلب DESIGN.md، أو سلّم الحزمة كاملة إلى Claude Code أو Cursor أو Copilot عبر خادم MCP.
curl -s https://stylepack.ai/packs/sweetgreen.com/DESIGN.mdأسئلة
ما كود hex الخاص بـ sweetgreen.com؟
اللون المميز في sweetgreen.com هو #0e150e؛ خلفية الصفحة #f4f3e7 ولون النص الرئيسي #0e150e. كل قيمة مقاسة من الصفحة المعروضة، فهي ما يراه الزوار، لا قيمة من دليل أنماط.
كيف أستخدم ألوان sweetgreen.com في Tailwind أو CSS؟
انسخ متغيرات CSS أو سمة Tailwind v4 من هذه الصفحة، أو نزّل حزمة التصميم: تتضمن tokens.json (بصيغة W3C design tokens) وtokens.css وtailwind.css بالقيم نفسها.