Sound Board

More Examples

• 
  Split Landing Page

  Split Landing Page

  Author:
  Rami AlAjo

  4 months ago

  859

  v.4.6
• 
  Likert Emoji Scale

  A Likert scale using emoji (svgs of bootstrap emojis). Has a label, radio button group named btnradio, and text for either end of the scale

  Author:
  Daniel

  2 months ago

  395

  v.5.3
• 
  HTML, CSS, and Bootstrap. This approach will be purely HTML and CSS without any JavaScript.

  HTML: Bootstrap Integration: Linked to Bootstrap CDN for styling. Form Structure: Contains input fields for name, email, and message, all within a card component. CSS: Background Gradient: Applied to the body for a visually appealing background. Card Styling: Rounded corners and padding for the card. Button Styling: Custom colors for the submit button, including hover effects. How to Use: Create an index.html file and copy the above code into it. Open the HTML file in your web browser to view the Contact Us form.

  Author:
  zobaidul kaziex

  10 months ago

  1.4k

  v.4.6
• 
  User Profile Card with Bootstrap

  How to Use: Replace Image URL: Update the src attribute of the img tag to the actual URL of the user’s image. Update Text: Change the text inside the h5 and p elements to reflect the user’s actual name and biography

  Author:
  zobaidul kaziex

  10 months ago

  2.1k

  v.4.6
• 
  Sign in form with bootstrap 5

  Beautiful sign-in card with Bootstrap 5

  Author:
  Prajwal Hallale

  1 year ago

  6.5k

  v.5.3
• 
  Product card component using Bootstrap 5

  Author:
  Mateo Rojas

  7 months ago

  1.3k

  v.5.3
• 
  Pricing Page with Bootstrap and Icons

  HTML: Navbar: Provides navigation links, including a link to the Pricing page. Pricing Section: Contains three columns, each representing a pricing plan with a card layout. Icons: Font Awesome icons are used for visual representation (e.g., stars and check circles). CSS: Card Styling: Adds border, shadow, and hover effects to the pricing cards. Plan-Specific Styles: Different border colors for each pricing plan (Free, Gold, Platinum). Button Styles: Different button colors to match the card styles. JavaScript: No custom JavaScript is required for this static pricing page, but you can add interactivity if needed. How to Use: Customize Content: Update the plan names, prices, features, and button actions as needed. Replace Icons: Choose different Font Awesome icons if desired by updating the <i> elements.

  Author:
  zobaidul kaziex

  10 months ago

  839

  v.4.6
• 
  Button pair

  sign up and login buttons

  Author:
  Anonymous

  10 months ago

  537

  v.5.3
• 
  Product Card

  Card diseñada para mostrar productos de forma atractiva y ordenada, inspirada en Mercado Libre. Incluye imagen fija, título uniforme, precio anterior tachado, precio actual con descuento y etiquetas promocionales como "Envío gratis". Incorpora un efecto hover con sombra acentuada y usa clases CSS para fácil integración y mantenimiento.

  Author:
  Facundo Banegaz

  4 months ago

  591

  v.4.6
• 
  Continue with google button

  Author:
  Noah Kim

  1 year ago

  4.8k

  v.4.6
• 
  Gradient Buttons

  Author:
  Prajwal Hallale

  1 year ago

  2.2k

  v.5.3
• 
  Boostrap Buttons

  Basic Buttons - Standard button styles with different color variations Outline Buttons - Ghost buttons with colored borders that fill on hover Button Sizes - Three different size variations for different contexts Icon Buttons - Buttons with Bootstrap Icons integration Block Buttons - Full-width buttons using Bootstrap's grid system Button Groups - Grouped buttons for related actions Loading Buttons - Interactive buttons with loading spinners

  Author:
  Asmath

  6 months ago

  1.7k

  v.5.3