/vt/ - Virtual Youtubers

>>48815900
>Spoiler
I know that feel, so I'll give you the ultra tl;dr version.
>Put Bootstrap's stylesheet in your header.
>You now have access to a shit-ton of pre-designed CSS classes for every kind of HTML element and common design component, such as buttons, forms, cards, navbars, modals, etc.
>You also get classes for all common CSS rules, such as colors, common margin sizes, borders, etc.
>Everything is designed to look good together and have modern web design sensibilities.
>Now, instead of writing out tons of CSS rules individually, you can just add tiny classes to your HTML elements.
See pic related. Giving a button the appropriate paddings, text colors, background colors, hover colors, hover transition animations, text decorations, and so on, is done just by adding class="btn btn-[ColorName]" to the element, instead of manually writing like 10+ CSS rules in a stylesheet. Inspect Element is open to show you what rules "btn" and "btn-primary" each imbued the first button with. The Danger button is hovered, so it's darkened. Anything you want to customize further can be given additional Bootstrap classes, or you can write a rule with !important; in your own stylesheet to override aspects of Bootstrap.

I chose this example because it's the simplest, most visual version of the idea, but it doesn't really illustrate just how much faster this makes design, building page layouts, working with flexbox, etc. Probably 3 or so times as fast as writing CSS manually. Even if not for what you're doing right now, it's worth a look. The basics are very easy to get started with and get a good result. Picrel is from the documentation: https://getbootstrap.com/docs/5.3/components/buttons/