बटन
causal.so के बटन
causal.so का प्राइमरी बटन #1a1a1a है, #f9f9f9 टेक्स्ट, 100px कोनों और 36px ऊँचाई के साथ। नीचे: साइट का हर बटन वैरिएंट, उसकी hover और focus states, और वह CSS जिससे आपके बटन वैसे ही दिखें।
causal.so से 4 दिन पहले मापा गया।
primary बटन
- Hover
- कोई दिखने लायक बदलाव नहीं
- Focus
- outline 2px solid rgb(26, 26, 26), offset 2px
- Transition
- color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, 0.3s
ghost बटन
- Hover
- कोई दिखने लायक बदलाव नहीं
CSS
हर वैरिएंट के लिए एक class, मापे गए मानों के साथ। फ़ॉन्ट वही है जो causal.so अपने बटनों पर सेट करता है।
.btn-primary {
display: inline-flex;
align-items: center;
justify-content: center;
height: 36px;
padding: 0px 14px;
background: #1a1a1a;
color: #f9f9f9;
border: none;
border-radius: 100px;
font-size: 14px;
font-weight: 600;
font-family: "Manrope Variable", sans-serif;
cursor: pointer;
}
.btn-ghost {
display: inline-flex;
align-items: center;
justify-content: center;
height: 20px;
padding: 0px 0px;
background: transparent;
color: #878787;
border: none;
border-radius: 0px;
font-size: 14px;
font-weight: 500;
font-family: "Manrope Variable", sans-serif;
cursor: pointer;
}AI एजेंट के लिए
पैक सादा टेक्स्ट है, कोई key नहीं: DESIGN.md लाएँ, या पूरा पैक MCP सर्वर से Claude Code, Cursor या Copilot को दें।
curl -s https://stylepack.ai/packs/causal.so/DESIGN.mdसवाल
causal.so जैसे बटन कैसे बनाऊँ?
इस पेज की CSS इस्तेमाल करें: प्राइमरी बटन #1a1a1a है, #f9f9f9 टेक्स्ट, 100px कोने, 36px ऊँचाई। हर वैरिएंट के नीचे दिए hover और focus नियम जोड़ें और बटन का फ़ॉन्ट वही रखें जो causal.so इस्तेमाल करता है।
causal.so के बटन किस रंग के हैं?
causal.so का प्राइमरी बटन #1a1a1a है, #f9f9f9 टेक्स्ट के साथ। साइट कुल 2 बटन वैरिएंट इस्तेमाल करती है; हर एक इस पेज पर अपने बैकग्राउंड, बॉर्डर, radius और साइज़ के साथ दिया है।
क्या कोई AI कोडिंग एजेंट causal.so के बटन कॉपी कर सकता है?
हाँ। Stylepack से मिला causal.so का डिज़ाइन पैक हर बटन वैरिएंट को उसकी states, फ़ॉन्ट, रंग और स्क्रीनशॉट के साथ रखता है, ताकि Claude Code, Cursor या Copilot वैसे ही बटन बना सकें।