Here are 20 things you can replace JavaScript with CSS, using its advanced capabilities such as animations, selectors, pseudo-elements and transitions: 1. **Animated Hamburger Menu**: Use CSS `:checked` and transitions to animate the opening and closing of the menu. 2. **Tooltip**: Use `:hover` and `::after` to create and style tooltips without JS. 3. **Accordion**: By combining `input:checked` and `label` with CSS `display` and `height`, you can make a functional accordion. 4. **Dropdown Menu**: Use `:hover` or `:focus-within` to show and hide Submenus. 5. **Tabs**: With `input:checked` and `display`, you can switch content in tabs. 6. **Loading animation**: Create spinners and loading bars with CSS animations. 7. **Hover animation**: Hover effects such as scale increase, color change and rotation can only be done with transitions and `:hover`. 8. **Smooth Scroll**: The `scroll-behavior: smooth` property allows smooth scrolling without JS. 8. **Modals**: Using `:target` or `:checked` to show and hide modals. 10. **Image Carousel**: Using `@keyframes`, transitions and `input:checked`, you can create image carousels. 11. **Background Transitions**: Change gradients or background images with `:hover` transitions. 12. **Text Animation**: Effects such as text typing or opacity changes can be done with `@keyframes`. 13. **Interactive Buttons**: Button click effects can be done with `:active` and `:focus`. 14. **Form Validation**: Use `:valid` and `:invalid` to create form validation based on HTML5 attributes. 15. **Slide-out Menu**: With `:checked` and `transitions`, you can create slide-out menus without JavaScript. 16. **Parallax effect**: Using `background-attachment: fixed` and `background-position`, you can create a simple parallax effect. 17. **Sort Lists**: Use the order property on the `Flexbox` or `Grid` to visually rearrange items. 18. **Like Button**: Use `:checked` and `::before` or `::after` to create a like button that changes appearance. 19. **Show/Hide Content**: Use `input[type=“checkbox”]:checked + div` to hide or show sections without the need for JS. 20. **Infinite Scroll**: Using `@keyframes` to animate items in a loop like in news sliders. Add more cases where we can use css instead of javascript.