{"html":"

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n

Narmesh Kumar Sah

@Your Web Wizard

\n Creative design and web enthusiast. Building digital experiences that\n matter.\n

\n \n \n

15k

Followers

Posts

4.8

Rating

\n","css":".profile-card {\n position: relative;\n width: 320px;\n background: rgba(255, 255, 255, 0.9);\n -webkit-backdrop-filter: blur(48px);\n backdrop-filter: blur(48px);\n border-radius: 20px;\n padding: 2rem;\n box-shadow: 12px 12px 12px -20px rgba(0, 0, 0, 0.3);\n transform: perspective(1000px) scale(0.8); /*adjust the scale to view properly*/\n transform-style: preserve-3d;\n}\n\n.profile-image {\n width: 100px;\n height: 100px;\n border-radius: 50%;\n background-color: #f0f2f5;\n margin: 0 auto 1rem;\n overflow: hidden;\n border: 3px solid white;\n box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.6);\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.profile-image::before {\n content: \"\";\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 96px;\n background-color: #7d988a;\n border-radius: 20px 20px 0 0;\n z-index: -1;\n}\n\n.profile-info {\n text-align: left;\n margin-bottom: 1.5rem;\n}\n\n.profile-name {\n font-size: 1.5rem;\n font-weight: 600;\n color: #1a1a1a;\n margin-bottom: 0.25rem;\n}\n\n.profile-title {\n font-size: 0.9rem;\n color: #666;\n margin-bottom: 0.5rem;\n}\n\n.profile-bio {\n font-size: 0.85rem;\n color: #777;\n line-height: 1.4;\n margin-bottom: 1.5rem;\n}\n\n.social-links {\n display: flex;\n gap: 0.5rem;\n margin-bottom: 1.5rem;\n}\n\n.social-btn {\n width: 40px;\n height: 40px;\n border-radius: 50%;\n border: none;\n background: #f0f2f5;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);\n}\n\n.social-btn:hover {\n background: #e4e6e9;\n transform: translateY(-6px);\n box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);\n}\n\n.social-btn svg {\n width: 20px;\n height: 20px;\n fill: #1a1a1a;\n transition: all 0.2s ease;\n}\n\n.social-btn:hover svg {\n fill: #0066ff;\n}\n\n/* Specific colors for each social platform */\n.social-btn.twitter:hover svg {\n fill: #1da1f2;\n}\n.social-btn.instagram:hover svg {\n fill: #e4405f;\n}\n.social-btn.linkedin:hover svg {\n fill: #0a66c2;\n}\n.social-btn.github:hover svg {\n fill: #333333;\n}\n\n.cta-button {\n width: 100%;\n padding: 0.8rem;\n border: none;\n border-radius: 10px;\n background: #7d988a;\n color: white;\n font-weight: 600;\n cursor: pointer;\n transition:\n transform 0.2s,\n background 0.2s;\n}\n\n.cta-button:hover {\n background: #4d5d54;\n transform: translateY(-2px);\n}\n\n.stats {\n display: flex;\n justify-content: space-between;\n margin-top: 1rem;\n padding-top: 1rem;\n border-top: 1px solid #eee;\n}\n\n.stat-item {\n text-align: center;\n}\n\n.stat-value {\n font-weight: 600;\n color: #1a1a1a;\n}\n\n.stat-label {\n font-size: 0.8rem;\n color: #666;\n}\n"}

sour-swan-62

👁 实时预览

📝 源代码