Spaces:
Running
Running
| title: README | |
| emoji: 🏃 | |
| colorFrom: blue | |
| colorTo: gray | |
| sdk: static | |
| pinned: false | |
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Crucible Labs</title> | |
| <link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;600;700&family=Space+Grotesk:wght@300;400;500;600&display=swap" rel="stylesheet"> | |
| <style> | |
| * { | |
| box-sizing: border-box; | |
| margin: 0; | |
| padding: 0; | |
| } | |
| body { | |
| font-family: 'Space Grotesk', sans-serif; | |
| font-size: 16px; | |
| line-height: 1.6; | |
| background-color: #0A0A0F; | |
| color: #FFFFFF; | |
| min-height: 100vh; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| padding: 10px; | |
| } | |
| .container { | |
| width: 100%; | |
| max-width: 800px; | |
| background-color: #141420; | |
| border-radius: 20px; | |
| box-shadow: 0 0 30px rgba(212, 165, 116, 0.15); | |
| border: 1px solid rgba(212, 165, 116, 0.3); | |
| padding: 20px; | |
| margin: 10px; | |
| background-image: | |
| radial-gradient(circle at 20% 50%, rgba(212, 165, 116, 0.1) 0%, transparent 40%), | |
| radial-gradient(circle at 80% 50%, rgba(0, 206, 209, 0.1) 0%, transparent 40%); | |
| } | |
| .logo { | |
| font-family: 'Orbitron', sans-serif; | |
| font-size: clamp(36px, 8vw, 48px); | |
| font-weight: 700; | |
| text-align: center; | |
| margin-bottom: 10px; | |
| letter-spacing: 0.1em; | |
| } | |
| .logo-steel { | |
| color: #D4A574; | |
| text-shadow: 0 0 20px rgba(212, 165, 116, 0.5); | |
| } | |
| .logo-tarek { | |
| color: #00CED1; | |
| text-shadow: 0 0 20px rgba(0, 206, 209, 0.5); | |
| } | |
| .tagline { | |
| text-align: center; | |
| color: #B0B0B0; | |
| text-transform: uppercase; | |
| letter-spacing: 0.2em; | |
| font-size: clamp(12px, 2.5vw, 14px); | |
| margin-bottom: 30px; | |
| } | |
| h1, h2, h3 { | |
| font-family: 'Orbitron', sans-serif; | |
| margin-bottom: 15px; | |
| font-weight: 600; | |
| } | |
| h2 { | |
| font-size: clamp(20px, 4vw, 24px); | |
| color: #D4A574; | |
| border-bottom: 2px solid rgba(212, 165, 116, 0.3); | |
| padding-bottom: 10px; | |
| margin-top: 25px; | |
| } | |
| p { | |
| margin-bottom: 15px; | |
| line-height: 1.8; | |
| font-size: clamp(14px, 3vw, 16px); | |
| color: #B0B0B0; | |
| } | |
| .description { | |
| text-align: center; | |
| max-width: 600px; | |
| margin: 0 auto 30px; | |
| } | |
| .content-section { | |
| background-color: rgba(20, 20, 32, 0.6); | |
| border-radius: 12px; | |
| padding: 15px; | |
| margin: 15px 0; | |
| border: 1px solid rgba(255, 255, 255, 0.1); | |
| } | |
| .team-grid { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); | |
| gap: 15px; | |
| margin: 15px 0; | |
| } | |
| .team-member { | |
| padding: 20px 15px; | |
| border-radius: 10px; | |
| background-color: rgba(20, 20, 32, 0.8); | |
| border: 1px solid rgba(255, 255, 255, 0.1); | |
| transition: all 0.3s ease; | |
| text-decoration: none; | |
| color: #FFFFFF; | |
| display: block; | |
| text-align: center; | |
| } | |
| .team-member:hover { | |
| transform: translateY(-5px); | |
| border-color: rgba(255, 255, 255, 0.3); | |
| } | |
| .team-member.steel { | |
| background-color: rgba(212, 165, 116, 0.1); | |
| border: 1px solid #8B6914; | |
| } | |
| .team-member.steel:hover { | |
| box-shadow: 0 0 20px rgba(212, 165, 116, 0.4); | |
| } | |
| .team-member.tarek { | |
| background-color: rgba(0, 206, 209, 0.1); | |
| border: 1px solid #191970; | |
| } | |
| .team-member.tarek:hover { | |
| box-shadow: 0 0 20px rgba(0, 206, 209, 0.4); | |
| } | |
| .team-member.darkhn { | |
| background-color: rgba(138, 43, 226, 0.1); | |
| border: 1px solid #4B0082; | |
| } | |
| .team-member.darkhn:hover { | |
| box-shadow: 0 0 20px rgba(138, 43, 226, 0.4); | |
| } | |
| .team-member-avatar { | |
| width: 80px; | |
| height: 80px; | |
| border-radius: 50%; | |
| margin: 0 auto 15px; | |
| overflow: hidden; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| font-family: 'Orbitron', sans-serif; | |
| font-size: 2rem; | |
| font-weight: 700; | |
| } | |
| .team-member-avatar img { | |
| width: 100%; | |
| height: 100%; | |
| object-fit: cover; | |
| } | |
| .steel .team-member-avatar { | |
| background: linear-gradient(135deg, #D4A574, #8B6914); | |
| color: #0A0A0F; | |
| } | |
| .tarek .team-member-avatar { | |
| background: linear-gradient(135deg, #00CED1, #191970); | |
| color: #0A0A0F; | |
| } | |
| .darkhn .team-member-avatar { | |
| background: linear-gradient(135deg, #8A2BE2, #4B0082); | |
| color: #0A0A0F; | |
| } | |
| .team-member h3 { | |
| font-size: clamp(16px, 3vw, 18px); | |
| margin-bottom: 5px; | |
| word-break: break-word; | |
| } | |
| .steel h3 { | |
| color: #FFD700; | |
| } | |
| .tarek h3 { | |
| color: #00FFFF; | |
| } | |
| .darkhn h3 { | |
| color: #DA70D6; | |
| } | |
| .team-member p { | |
| font-size: clamp(12px, 2.5vw, 14px); | |
| margin-bottom: 15px; | |
| color: #B0B0B0; | |
| } | |
| .team-links { | |
| display: flex; | |
| gap: 10px; | |
| justify-content: center; | |
| flex-wrap: wrap; | |
| } | |
| .team-link { | |
| font-size: clamp(11px, 2vw, 13px); | |
| color: #FFFFFF; | |
| text-decoration: none; | |
| padding: 5px 10px; | |
| border-radius: 15px; | |
| transition: all 0.3s ease; | |
| } | |
| .steel .team-link { | |
| background-color: rgba(212, 165, 116, 0.2); | |
| border: 1px solid rgba(212, 165, 116, 0.5); | |
| } | |
| .steel .team-link:hover { | |
| background-color: rgba(212, 165, 116, 0.3); | |
| } | |
| .tarek .team-link { | |
| background-color: rgba(0, 206, 209, 0.2); | |
| border: 1px solid rgba(0, 206, 209, 0.5); | |
| } | |
| .tarek .team-link:hover { | |
| background-color: rgba(0, 206, 209, 0.3); | |
| } | |
| .darkhn .team-link { | |
| background-color: rgba(138, 43, 226, 0.2); | |
| border: 1px solid rgba(138, 43, 226, 0.5); | |
| } | |
| .darkhn .team-link:hover { | |
| background-color: rgba(138, 43, 226, 0.3); | |
| } | |
| .button { | |
| display: inline-block; | |
| background: linear-gradient(135deg, #D4A574, #00CED1); | |
| color: #0A0A0F; | |
| padding: 12px 30px; | |
| border-radius: 25px; | |
| text-decoration: none; | |
| font-weight: 600; | |
| font-family: 'Orbitron', sans-serif; | |
| transition: all 0.3s ease; | |
| text-align: center; | |
| margin: 10px 0; | |
| width: 100%; | |
| max-width: 300px; | |
| font-size: clamp(14px, 3vw, 16px); | |
| } | |
| .button:hover { | |
| transform: translateY(-2px); | |
| box-shadow: 0 5px 15px rgba(255, 255, 255, 0.2); | |
| } | |
| @media (max-width: 480px) { | |
| .container { | |
| padding: 15px; | |
| margin: 5px; | |
| } | |
| .team-grid { | |
| grid-template-columns: 1fr; | |
| gap: 10px; | |
| } | |
| .team-member { | |
| padding: 15px; | |
| } | |
| .content-section { | |
| padding: 12px; | |
| } | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <h1 class="logo"> | |
| <img src="https://cdn-uploads.huggingface.co/production/uploads/64545af5ec40bbbd01242ca6/yaWnGZMtLj6JRRMzkiOC5.png" alt="img"> | |
| </h1> | |
| <p class="tagline"></p> | |
| <p class="description">Welcome to Crucible Labs, where the belief is that the best ideas come from the crucible of collaboration.</p> | |
| <h2>The Team</h2> | |
| <div class="team-grid"> | |
| <div class="team-member steel"> | |
| <div class="team-member-avatar"> | |
| <img src="https://cdn-avatars.huggingface.co/v1/production/uploads/64545af5ec40bbbd01242ca6/xRbPO8262bQ030329Kn7R.png" alt="Steelskull"> | |
| </div> | |
| <h3>Steelskull</h3> | |
| <p>Paramancer</p> | |
| <div class="team-links"> | |
| <a href="https://huggingface.co/Steelskull" class="team-link" target="_blank">HuggingFace</a> | |
| <a href="https://ko-fi.com/steelskull" class="team-link" target="_blank">Ko-fi</a> | |
| </div> | |
| </div> | |
| <div class="team-member tarek"> | |
| <div class="team-member-avatar"> | |
| <img src="https://cdn-avatars.huggingface.co/v1/production/uploads/64909c086073a0cd172d0411/Z4VkLtxQTg7Ex3vv84yz8.webp" alt="Tarek"> | |
| </div> | |
| <h3>Tarek07</h3> | |
| <p>Mad-Lad</p> | |
| <div class="team-links"> | |
| <a href="https://huggingface.co/Tarek07" class="team-link" target="_blank">HuggingFace</a> | |
| <a href="https://ko-fi.com/tarek07" class="team-link" target="_blank">Ko-fi</a> | |
| </div> | |
| </div> | |
| <div class="team-member darkhn"> | |
| <div class="team-member-avatar"> | |
| <img src="https://cdn-avatars.huggingface.co/v1/production/uploads/673fa5ccbf2e9c35b2ec841a/rPHaMrqyYTfSJ89NN8KgY.jpeg" alt="Darkhn"> | |
| </div> | |
| <h3>Darkhn</h3> | |
| <p>Dataset Chronicler</p> | |
| <div class="team-links"> | |
| <a href="https://huggingface.co/Darkhn" class="team-link" target="_blank">HuggingFace</a> | |
| <a href="https://ko-fi.com/som1tokmynam" class="team-link" target="_blank">Ko-fi</a> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="content-section"> | |
| <h2>About Our Models</h2> | |
| <p>We specialize in experimental merging and tuning techniques. Our focus is on creative applications, particularly in narrative generation.</p> | |
| </div> | |
| </div> | |
| </body> | |
| </html> | |