Stylepack

الأزرار

أزرار holographik.space

الزر الأساسي في holographik.space لونه #000000 بنص #ffffff، وزواياه 9999px، وارتفاعه 29px. أدناه: كل أنواع الأزرار التي يستخدمها الموقع، وحالات hover والتركيز فيها، وكود CSS لتبدو أزرارك مثلها.

تم القياس من holographik.space قبل 4 أيام.

افتح حزمة التصميم الكاملةتنزيل الحزمة

زر primary

Book the SpaceBook
Hover
لا تغيير مرئي
التركيز
outline 2px solid rgb(0, 0, 0), offset 2px
الانتقال
background, color, 0.15s, 0.15s

زر secondary

Instagram
Hover
background transparent → #ffffff1a, text #b7b7b2 → #ffffff, icon/inner colour → #ffffff
الانتقال
color, background, 0.15s, 0.15s

كود CSS

فئة واحدة لكل نوع، بالقيم المقاسة. الخط هو الذي يستخدمه holographik.space في أزراره.

buttons.css
.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 29px;
  padding: 7px 14px;
  background: #000000;
  color: #ffffff;
  border: none;
  border-radius: 9999px;
  font-size: 13px;
  font-weight: 500;
  font-family: "KH Teka", sans-serif;
  cursor: pointer;
}
​
.btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 27px;
  padding: 6px 12px;
  background: #f1f1f1;
  color: #000000;
  border: none;
  border-radius: 0px;
  font-size: 13px;
  font-weight: 500;
  font-family: "KH Teka", sans-serif;
  cursor: pointer;
}

لوكلاء الذكاء الاصطناعي

الحزمة نص عادي بلا مفتاح: اجلب DESIGN.md، أو سلّم الحزمة كاملة إلى Claude Code أو Cursor أو Copilot عبر خادم MCP.

curl -s https://stylepack.ai/packs/holographik.space/DESIGN.md

أسئلة

كيف أصنع أزرارًا مثل holographik.space؟

استخدم كود CSS في هذه الصفحة: الزر الأساسي لونه #000000 بنص #ffffff، وزواياه 9999px، وارتفاعه 29px. أضف قواعد hover والتركيز المذكورة تحت كل نوع، واضبط خط الزر على الخط الذي يستخدمه holographik.space.

ما لون أزرار holographik.space؟

الزر الأساسي في holographik.space لونه #000000 بنص #ffffff. يستخدم الموقع 2 أنواع من الأزرار في المجموع؛ كل نوع مذكور في هذه الصفحة بخلفيته وحدوده واستدارته وحجمه.

هل يستطيع وكيل برمجة بالذكاء الاصطناعي نسخ أزرار holographik.space؟

نعم. تحتوي حزمة تصميم holographik.space من Stylepack على كل أنواع الأزرار بحالاتها والخطوط والألوان ولقطات الشاشة، فيستطيع Claude Code أو Cursor أو Copilot بناء أزرار مطابقة.