w3hubs Goto Github PK

3-column-preview-card-component-main

Frontend Mentor is one of the popular platforms for improving your frontend development skills. This website has frontend challenges for a developer who is given JPEG design files for mobile & desktop layouts.

404-error-page-design-in-tailwind-css

404 Error pages are mostly used to show some errors like URL broke or page not found view side. So here we made a 404 error page in Tailwind CSS with the help of the Utility class.

404-error-page-in-bootstrap-4

adblocker-detected-popup-in-tailwind-css

Google chromes have many extensions for adblocker with different types of views. So as same we made here a simple Adblocker Detected Popup In Tailwind CSS.

animated-3d-buttons-in-bulma

Bulma is a popular CSS framework that is built-in Sass(CSS preprocessor) with the help of a flexbox. So here made simple Animated 3d Buttons In Bulma and also we modify button with a help of CSS.

animated-text-background-effect-in-css

Animated Text Background Effect is mostly used to show any text any within different animations. So here made an awesome Animated Text Background Effect In HTML and CSS with the help of background images.

animated-typing-effect-using-typed.js

Typed.js is jquery plugins to make animation text effects to show text in typed format. so here we made these effects using Typed.js CDN link with the help of jquery string and loop features.

blog-section-in-bootstrap-5

Previously we made a blog section in bootstrap 4, but here we made a blog section in bootstrap 5. Also, we used the same CSS properties. In this case, we remove font-awesome icons and also modify UI with CSS media queries.

bootstrap-5-custom-alert

In this custom alert, we used unique background colours. Also, we modify the bootstrap class CSS properties in this custom bootstrap 5 alerts.

bootstrap-5-custom-badges

Badges are mostly used for a show a piece of additional information is quick views. So here we made simple and custom Badges in bootstrap 5 and with the help of custom classes for background colors.

bootstrap-5-facebook-login-page

Facebook is a popular social media website that is connected with new people and also chats with them. So here we made Facebook Login Page in Bootstrap 5 with the help of CSS and Bootstrap 5.

bootstrap-5-gradient-button-with-hover-effect

In this element, we use Gradient background color for buttons. Here we also modify bootstrap classes used in these frameworks.

bootstrap-5-neon-buttons

Neon Buttons are like light animation effects which are made using box-shadow css properties. So here we try to make this neon light animation in bootstrap 5 button components.

bootstrap-5-neumorphic-buttons

Bootstrap 5 has the best components to make a website in a short time with fully responsive. But here we made something different with button components. We made Neumorphic Buttons in bootstrap with the help of CSS and utilities classes of bootstrap 5.

bootstrap-5-neumorphism-under-construction-pages

Under Construction, the page is used for the show if the website is a Construction side of the website is not ready for launch. So here we made responsive Under Construction Pages in Neumorphism CSS in bootstrap 5.

bootstrap-5-post-with-thumbnails-card

Thumbnails view posts are used for blog user-interface with different views. So here we try to make a simple interface using bootstrap 5 and CSS.

bootstrap-5-responsive-contact-us-form-with-social-icons

In this contact us form we used social icons from font awesome and also we try to make an attractive user-interface of this form. So here we made responsive contact us form using bootstrap 5 and the help of CSS & fonts(font awesome).

bootstrap-5-responsive-pricing-card

Pricing Card is used on the website to show product price with some features. So here we made Responsive Pricing Card in Bootstrap 5 with CSS3.

bootstrap-5-responsive-shopping-cart-widget

This Widget is used on the eCommerce website to show products for sale. So here we made a responsive Shopping cart Widget in bootstrap 5 with the help of CSS and bootstrap components.

bootstrap-5-responsive-sidebars-with-javascript

Sidebar or side navbar is mostly used in web application side in a vertical view with important link/menu. So here we made Responsive Sidebars in Bootstrap 5 With JavaScript.

bootstrap-progress-bar-percentage-using-jquery

In this bootstrap progress bar, we used jquery with a javascript method. For increment, we used the javascript setTimeout method, and also we used some basic javascript DOM to change value dynamically.

bootstrap-team-page-section

As you Know what is bootstrap and why we use this framework, to design a website with fully responsive and mobile friendly. Here we design team section element with using bootstrap. Here we used bootstrap classes to make a more beautiful section of the Team Page. This element is fully responsive with all views and you can use in your project or any website.

bootstrap-to-do-list-using-jquery

To-do List is mostly used to add your today’s task or any important work you have to do today. So there are so many ways to make a To-do list but here we made it in jquery with the help of bootstrap.

bulma-hero-backgrounds-templates

We made so many elements in different frameworks with the help of CSS and also we modify some classes in frameworks. So here we made simple Bulma Hero Backgrounds Templates with the help of the utility class and also we modify the height class.

bulma-modal-login-and-register-form-with-jquery

Modal is the best component in every CSS or frontend framework. So here we made the login and registration form in modal with the help of the Bulma CSS framework.

bulma-registration-form

Bulma is an open-source front-end CSS framework for making websites with the help of giving classes. So here we design the Responsive Bulma Registration Form with some CSS properties & Bulma components and utility classes.

bulma-responsive-pricing-table

In this Bulma Responsive Pricing Table, we used grid classes of Bulma. Here we made a pricing table in Bulma with helper class and utilities classes.

changes-color-use-any-icons-and-text-in-css-marker

:: marker is pseudo-element for use in list-item in ul, li side. So here we made this simple and useful pseudo-element with the help of CSS properties.

clean-contact-us-form-in-bootstrap-5

We previously made a different type of Contact us form in pure CSS and HTML. So here we made a clean and simple Contact Us Form In Bootstrap 5 with the help of CSS properties.

contact-us-form-in-bootstrap

Contact us Element is the most important part of the website for user feedback and suggestions. User visits and sends the message from this contact form. But, here we design only form with using the Bootstrap CSS framework with the mobile-friendly web page.