बटन
relume.ai के बटन
relume.ai का प्राइमरी बटन #ff00f4 है, #ffffff टेक्स्ट, 6px कोनों और 32px ऊँचाई के साथ। नीचे: साइट का हर बटन वैरिएंट, उसकी hover और focus states, और वह CSS जिससे आपके बटन वैसे ही दिखें।
relume.ai से 4 दिन पहले मापा गया।
primary बटन
- Hover
- moves down 1px
- Focus
- outline 1px auto rgb(16, 16, 16)
- Transition
- opacity, color, border-color, background-color, transform, 0.2s, 0.2s, 0.2s, 0.2s, 0.2s
secondary बटन
- Hover
- कोई दिखने लायक बदलाव नहीं
- Transition
- opacity, color, border-color, background-color, transform, 0.2s, 0.2s, 0.2s, 0.2s, 0.2s
ghost बटन
- Hover
- कोई दिखने लायक बदलाव नहीं
CSS
हर वैरिएंट के लिए एक class, मापे गए मानों के साथ। फ़ॉन्ट वही है जो relume.ai अपने बटनों पर सेट करता है।
.btn-primary {
display: inline-flex;
align-items: center;
justify-content: center;
height: 32px;
padding: 6px 12px;
background: #ff00f4;
color: #ffffff;
border: none;
border-radius: 6px;
font-size: 14px;
font-weight: 400;
font-family: "Geist Variable", sans-serif;
cursor: pointer;
}
.btn-secondary {
display: inline-flex;
align-items: center;
justify-content: center;
height: 88px;
padding: 0px 0px;
background: #ffffffeb;
color: #101010;
border: none;
border-radius: 9999px;
font-size: 14px;
font-weight: 400;
font-family: "Geist Variable", sans-serif;
box-shadow: rgba(0, 0, 0, 0.24) 0px 8px 32px 0px;
cursor: pointer;
}
.btn-ghost {
display: inline-flex;
align-items: center;
justify-content: center;
height: 25px;
padding: 0px 8px;
background: transparent;
color: #161616;
border: none;
border-radius: 6px;
font-size: 14px;
font-weight: 400;
font-family: "Geist Variable", sans-serif;
cursor: pointer;
}AI एजेंट के लिए
पैक सादा टेक्स्ट है, कोई key नहीं: DESIGN.md लाएँ, या पूरा पैक MCP सर्वर से Claude Code, Cursor या Copilot को दें।
curl -s https://stylepack.ai/packs/relume.ai/DESIGN.mdसवाल
relume.ai जैसे बटन कैसे बनाऊँ?
इस पेज की CSS इस्तेमाल करें: प्राइमरी बटन #ff00f4 है, #ffffff टेक्स्ट, 6px कोने, 32px ऊँचाई। हर वैरिएंट के नीचे दिए hover और focus नियम जोड़ें और बटन का फ़ॉन्ट वही रखें जो relume.ai इस्तेमाल करता है।
relume.ai के बटन किस रंग के हैं?
relume.ai का प्राइमरी बटन #ff00f4 है, #ffffff टेक्स्ट के साथ। साइट कुल 3 बटन वैरिएंट इस्तेमाल करती है; हर एक इस पेज पर अपने बैकग्राउंड, बॉर्डर, radius और साइज़ के साथ दिया है।
क्या कोई AI कोडिंग एजेंट relume.ai के बटन कॉपी कर सकता है?
हाँ। Stylepack से मिला relume.ai का डिज़ाइन पैक हर बटन वैरिएंट को उसकी states, फ़ॉन्ट, रंग और स्क्रीनशॉट के साथ रखता है, ताकि Claude Code, Cursor या Copilot वैसे ही बटन बना सकें।