How To Make Button like vegamovie


To make the button text color black, you can modify the color property in the inline style attribute of each button. Here's the updated code:

<style>
			    
			.btn.btn-sm.btn-outline {
    font-size: 16px;
    padding: 12px 24px;
    margin: 10px;
    border: none;
    cursor: pointer;
    color: black; /* Changed text color to black */
    text-transform: uppercase;
    font-weight: bold;
    border-radius: 8px;
    text-shadow: 0 0 5px #fff;
    position: relative;
    transition: 0.3s;
    overflow: hidden;
}

.btn.btn-sm.btn-outline::before {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    border-radius: 8px;
    z-index: -1;
    opacity: 0.8;
    filter: blur(10px);
    transition: 0.3s;
}

.btn.btn-sm.btn-outline:hover {
    transform: scale(1.05);
    box-shadow: 0 0 20px rgba(255, 255, 255, 0.9);
}

/* V-Cloud Button Styling LuxTechZone */
.btn.btn-sm.btn-outline[style*="ed0b0b"] {
    box-shadow: 0 0 15px rgba(237, 11, 11, 0.8);
}

.btn.btn-sm.btn-outline[style*="ed0b0b"]::before {
    background: linear-gradient(135deg, #ff0000, #ffcc00);
}

/* GDToT Button Styling LuxTechZone */
.btn.btn-sm.btn-outline[style*="2ea1cf"] {
    box-shadow: 0 0 15px rgba(46, 161, 207, 0.8);
}

.btn.btn-sm.btn-outline[style*="2ea1cf"]::before {
    background: linear-gradient(135deg, #00ffff, #ff00ff);
}

</style>

<p style="text-align: center;">
<a href="#" rel="nofollow noopener noreferrer" target="_blank">
<button class="btn btn-sm btn-outline" style="background: linear-gradient(135deg, rgb(14, 186, 195), rgb(9, 210, 97)); color: black;"><i class="fa fa-download"></i> ⚡ G-Direct [Instant] <i class="fa fa-download"></i></button></a> 
  
<a href="#" rel="nofollow noopener noreferrer" target="_blank"><button class="btn btn-sm btn-outline" style="background: linear-gradient(135deg, rgb(237, 11, 11), rgb(242, 209, 82)); color: black;"><i class="fa fa-download"></i> ⚡ V-Cloud [Resumable] <i class="fa fa-download"></i></button></a> 
  
<a href="#" rel="nofollow noopener noreferrer" target="_blank"><button class="btn btn-sm btn-outline" style="background: linear-gradient(135deg, rgb(252, 185, 0) 0%, rgb(0, 0, 0)); color: black;">  ⚡ Filepress [G-Drive] </button></a> 
  

  <a href="#" rel="nofollow noopener noreferrer" target="_blank"><button class="btn btn-sm btn-outline" style="background: linear-gradient(135deg, rgb(46, 161, 207), rgb(255, 25, 208)); color: black;"><i class="fa fa-download"></i> ⚡ GDToT [G-Drive] <i class="fa fa-download"></i></button></a> 
  
  
<a href="#" rel="nofollow noopener noreferrer" target="_blank"><button class="btn btn-sm btn-outline" style="background: linear-gradient(135deg, rgba(4, 88, 114, 0.82), rgba(255, 99, 128, 0.73)); color: black;"><i class="fa fa-download"></i> DropGalaxy</button></a>
Demo

Now, all button text will appear in black while keeping the gradient backgrounds intact. Let me know if you need further tweaks!


To add these custom-styled buttons to your Blogger post or page, follow these steps:

1. Open Blogger and Edit a Post/Page

  • Go to Blogger and Sign in to your blog.
  • Open the post or page where you want to add the buttons, or create a new one.

2. Switch to HTML View

  • In the post editor, click on "HTML" mode (next to "Compose").

3. Paste the HTML Code

  • Copy and paste the following code into the HTML editor:

4. Save and Publish

  • Click "Save" or "Publish" to make the buttons visible on your Blogger page.

Now, your buttons will appear with a black text color and stylish gradient backgrounds. Let me know if you need any modifications!

Next Post Previous Post
No Comment
Add Comment
comment url