#!pip install diffusers transformers accelerate safetensors torch torchvision pillow --quiet gradio # 🚀 Gradio Chatbot Space for DarkNeuron Chat v1.1 # Author: @Madara369Uchiha | Works perfectly on Hugging Face Spaces import gradio as gr import torch from transformers import AutoTokenizer, AutoModelForCausalLM, pipeline # 🔧 Model Setup model_name = "DarkNeuron-AI/darkneuron-chat-v1.1" tokenizer = AutoTokenizer.from_pretrained(model_name) model = AutoModelForCausalLM.from_pretrained(model_name, torch_dtype=torch.float16 if torch.cuda.is_available() else torch.float32) device = 0 if torch.cuda.is_available() else -1 # ⚙️ Create Chat Pipeline chatbot = pipeline( "text-generation", model=model, tokenizer=tokenizer, device=device, return_full_text=False ) # 🧠 Chat Function def chat_fn(message, history): history_text = "" for user, bot in history: history_text += f"User: {user}\nBot: {bot}\n" prompt = f"{history_text}User: {message}\nBot:" response = chatbot( prompt, max_length=200, do_sample=True, temperature=0.7, top_p=0.9, num_return_sequences=1 )[0]["generated_text"] return response.strip() # 🎨 Ultra Premium DarkNeuron Chat v1.1 # Perfect Dark Theme - No Tint - Premium Look # ... (Your chat_fn code stays here) ... # 🎨 Perfect Dark Premium CSS - NO TINT custom_css = """ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap'); @import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css'); * { margin: 0; padding: 0; box-sizing: border-box; } /* Ultra Dark Background */ .gradio-container { background: #0d1117 !important; min-height: 100vh; } /* Hide ALL Scrollbars */ ::-webkit-scrollbar { display: none !important; } * { scrollbar-width: none !important; -ms-overflow-style: none !important; } /* Premium Glass Header */ .glass-header { background: rgba(13, 17, 23, 0.8); backdrop-filter: blur(30px); border: 1px solid rgba(139, 122, 255, 0.3); border-radius: 24px; padding: 1.5rem 2rem; margin-bottom: 2rem; box-shadow: 0 8px 40px rgba(139, 122, 255, 0.2); } .logo-container { display: flex; align-items: center; justify-content: center; gap: 1rem; margin-bottom: 0.5rem; } .logo-icon { font-size: 3rem; color: #8b7aff; filter: drop-shadow(0 0 25px rgba(139, 122, 255, 0.7)); animation: pulse 2s ease-in-out infinite; } @keyframes pulse { 0%, 100% { transform: scale(1); filter: drop-shadow(0 0 25px rgba(139, 122, 255, 0.7)); } 50% { transform: scale(1.15); filter: drop-shadow(0 0 40px rgba(139, 122, 255, 1)); } } .logo-text { font-size: 2.3rem; font-weight: 900; background: linear-gradient(135deg, #8b7aff 0%, #b794f6 50%, #da92ff 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .version-tag { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1.3rem; background: rgba(139, 122, 255, 0.2); border: 1px solid rgba(139, 122, 255, 0.4); border-radius: 30px; font-size: 0.9rem; color: #c4b5ff; box-shadow: 0 4px 20px rgba(139, 122, 255, 0.25); } /* Hero Section */ .hero-section { text-align: center; padding: 3rem 0 4rem; } .hero-title { font-size: 4.5rem; font-weight: 900; color: #ffffff; margin-bottom: 1.5rem; text-shadow: 0 0 80px rgba(139, 122, 255, 0.8); letter-spacing: -0.02em; } .hero-subtitle { font-size: 1.4rem; color: rgba(255, 255, 255, 0.75); max-width: 800px; margin: 0 auto 2rem; line-height: 1.8; } /* Feature Cards - PURE DARK, NO TINT */ .feature-glass-card { background: rgba(139, 122, 255, 0.25) !important; border: 1px solid rgba(139, 122, 255, 0.25) !important; border-radius: 24px !important; padding: 3rem 2.5rem !important; transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important; box-shadow: 0 8px 40px rgba(0, 0, 0, 0.6) !important; position: relative; overflow: hidden; } .feature-glass-card::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: transparent !important; pointer-events: none; } .feature-glass-card::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(139, 122, 255, 0.08), transparent); transition: left 0.8s ease; } .feature-glass-card:hover::before { left: 100%; } .feature-glass-card:hover { transform: translateY(-12px) scale(1.03); background: #1c2128 !important; border-color: rgba(139, 122, 255, 0.5) !important; box-shadow: 0 20px 60px rgba(139, 122, 255, 0.4) !important; } .icon-box { background: transparent !important; border: none !important; padding: 1.5rem !important; border-radius: 16px !important; margin-bottom: 2rem !important; display: inline-block; } .icon-wrapper { font-size: 4.5rem; display: inline-block; transition: all 0.6s ease; filter: drop-shadow(0 8px 20px rgba(139, 122, 255, 0.4)); } .feature-glass-card:hover .icon-wrapper { transform: rotateY(360deg) scale(1.2); filter: drop-shadow(0 12px 30px rgba(139, 122, 255, 0.7)); } .feature-title-glass { font-size: 1.6rem; font-weight: 800; color: #ffffff; margin-bottom: 1rem; letter-spacing: -0.01em; } .feature-desc-glass { color: rgba(255, 255, 255, 0.7); line-height: 1.8; font-size: 1rem; } /* Chat Container */ .chat-container-glass { background: #161b22; border: 2px solid #4ade80; border-radius: 24px; padding: 2rem; box-shadow: 0 0 50px rgba(74, 222, 128, 0.25); } /* Settings Sidebar */ .settings-sidebar { background: #161b22; border: 1px solid rgba(139, 122, 255, 0.25); border-radius: 20px; padding: 2rem; box-shadow: 0 8px 40px rgba(0, 0, 0, 0.5); } .settings-header { font-size: 1.2rem; font-weight: 700; color: #b794f6; margin-bottom: 1.5rem; display: flex; align-items: center; gap: 0.5rem; padding-bottom: 1rem; border-bottom: 1px solid rgba(139, 122, 255, 0.2); } /* Sliders & Inputs */ label { color: rgba(255, 255, 255, 0.8) !important; font-weight: 600 !important; font-size: 0.9rem !important; } input[type="range"] { -webkit-appearance: none; width: 100%; height: 6px; border-radius: 5px; background: rgba(255, 255, 255, 0.2) !important; outline: none; } input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 18px; height: 18px; border-radius: 50%; background: linear-gradient(135deg, #8b7aff, #b794f6); cursor: pointer; box-shadow: 0 0 15px rgba(255, 255, 255, 0.6); } input[type="number"], textarea { background: #0d1117 !important; border: 1px solid rgba(255, 255, 255, 0.3) !important; border-radius: 10px !important; color: white !important; padding: 0.7rem !important; } /* Chatbot */ .chatbot { border: none !important; background: transparent !important; } /* Input Box */ .input-glass-box input, .input-glass-box textarea { background: #0d1117 !important; border: 1px solid rgba(139, 122, 255, 0.3) !important; border-radius: 14px !important; padding: 1rem 1.3rem !important; color: rgba(255, 255, 255, 0.95) !important; font-size: 1rem !important; } .input-glass-box input::placeholder, .input-glass-box textarea::placeholder { color: rgba(255, 255, 255, 0.5) !important; } .input-glass-box input:focus, .input-glass-box textarea:focus { background: #0d1117 !important; border-color: rgba(139, 122, 255, 0.6) !important; box-shadow: 0 0 25px rgba(139, 122, 255, 0.4) !important; outline: none !important; } /* Buttons */ button { border-radius: 14px !important; font-weight: 700 !important; padding: 0.9rem 2rem !important; transition: all 0.4s ease !important; font-size: 1rem !important; } .primary-btn { background: linear-gradient(135deg, #8b7aff 0%, #b794f6 100%) !important; border: none !important; color: white !important; box-shadow: 0 6px 25px rgba(139, 122, 255, 0.5); } .primary-btn:hover { transform: translateY(-4px) scale(1.05) !important; box-shadow: 0 15px 45px rgba(139, 122, 255, 0.7) !important; } .secondary-btn { background: #0d1117 !important; border: 1px solid rgba(139, 122, 255, 0.35) !important; color: rgba(255, 255, 255, 0.95) !important; } .secondary-btn:hover { background: #161b22 !important; transform: translateY(-4px) !important; box-shadow: 0 12px 35px rgba(139, 122, 255, 0.35) !important; } /* Section Headers */ .section-header-glass { text-align: center; font-size: 3rem; font-weight: 900; background: linear-gradient(135deg, #8b7aff, #b794f6, #da92ff); -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin: 5rem 0 3.5rem; letter-spacing: -0.02em; } .section-header-glass::after { content: ''; display: block; width: 120px; height: 5px; background: linear-gradient(90deg, #8b7aff, #b794f6); margin: 1.3rem auto 0; border-radius: 3px; } /* Footer */ .footer-glass { background: rgba(13, 17, 23, 0.8); backdrop-filter: blur(20px); border-top: 1px solid rgba(139, 122, 255, 0.25); padding: 3rem; margin-top: 6rem; text-align: center; color: rgba(255, 255, 255, 0.65); } /* Floating Animation */ @keyframes float { 0%, 100% { transform: translateY(0px); } 50% { transform: translateY(-20px); } } .floating { animation: float 3s ease-in-out infinite; } /* Responsive */ @media (max-width: 768px) { .hero-title { font-size: 2.5rem; } .hero-subtitle { font-size: 1.1rem; } .feature-glass-card { padding: 2rem !important; } } """ # 🎯 Ultra Dark Theme custom_theme = gr.themes.Soft( primary_hue="purple", secondary_hue="blue", neutral_hue="slate", font=gr.themes.GoogleFont("Inter"), ).set( body_background_fill="#0d1117", block_background_fill="#161b22", input_background_fill="#0d1117", ) # 🚀 Build Interface with gr.Blocks(theme=custom_theme, css=custom_css, title="DarkNeuron Chat v1.1") as demo: # 🌟 Header with gr.Column(elem_classes=["glass-header"]): gr.HTML("""
Experience the pinnacle of AI conversation with advanced controls, stunning ultra-dark visuals, and blazing-fast performance.
""") # 💬 Chat Interface with Settings Sidebar with gr.Row(): # ⚙️ Settings Sidebar (Left) with gr.Column(scale=2, elem_classes=["settings-sidebar"]): gr.HTML('