How to remove background color from image & set webpage background using CSS trick only.
Harshal Kahar
Posted on January 9, 2024
Working on my project and stumbled upon a cool ๐๐ฟ๐ถ๐ฐ๐ธ in ๐ง๐ฎ๐ถ๐น๐๐ถ๐ป๐ฑ ๐๐ฆ๐ฆ & ๐๐ฆ๐ฆ the ๐บ๐ถ๐ -๐ฏ๐น๐ฒ๐ป๐ฑ-๐บ๐๐น๐๐ถ๐ฝ๐น๐ class! ๐จ
It's a ๐ด๐ฎ๐บ๐ฒ-๐ฐ๐ต๐ฎ๐ป๐ด๐ฒ๐ฟ for setting ๐ถ๐บ๐ฎ๐ด๐ฒ ๐ฏ๐ฎ๐ฐ๐ธ๐ด๐ฟ๐ผ๐๐ป๐ฑ๐ ๐ผ๐ป ๐๐ฒ๐ฏ ๐ฝ๐ฎ๐ด๐ฒ๐, ๐ป๐ผ ๐ป๐ฒ๐ฒ๐ฑ ๐ณ๐ผ๐ฟ ๐ฏ๐ฎ๐ฐ๐ธ๐ด๐ฟ๐ผ๐๐ป๐ฑ ๐ฟ๐ฒ๐บ๐ผ๐๐ฎ๐น ๐๐ผ๐ผ๐น๐! Works like a charm, even if your image has a ๐ฑ๐ถ๐ณ๐ณ๐ฒ๐ฟ๐ฒ๐ป๐ ๐ฐ๐ผ๐น๐ผ๐ฟ ๐ฏ๐ฎ๐ฐ๐ธ๐ด๐ฟ๐ผ๐๐ป๐ฑ.
๐ค๐๐ถ๐ฐ๐ธ ๐๐ฒ๐๐ฎ๐ถ๐น๐:
โจ ๐ง๐ฎ๐ถ๐น๐๐ถ๐ป๐ฑ ๐๐ฆ๐ฆ: Simply include ๐บ๐ถ๐ -๐ฏ๐น๐ฒ๐ป๐ฑ-๐บ๐๐น๐๐ถ๐ฝ๐น๐ in your class list of an image, and there you go! Seamless, stunning web page backgrounds.
โจ๐๐ฆ๐ฆ: For the traditionalists, use ๐บ๐ถ๐ -๐ฏ๐น๐ฒ๐ป๐ฑ-๐บ๐ผ๐ฑ๐ฒ: ๐บ๐๐น๐๐ถ๐ฝ๐น๐; same awesome results!
โจ ๐ฆ๐ถ๐บ๐ฝ๐น๐ฒ, ๐๐๐๐น๐ถ๐๐ต, ๐ฎ๐ป๐ฑ ๐ฎ๐ฑ๐ฑ๐ ๐ฎ ๐๐ป๐ถ๐พ๐๐ฒ ๐๐ผ๐๐ฐ๐ต ๐๐ผ ๐๐ผ๐๐ฟ ๐ฑ๐ฒ๐๐ถ๐ด๐ป๐. ๐ก๐ผ ๐บ๐ผ๐ฟ๐ฒ ๐ต๐ฎ๐๐๐น๐ฒ, ๐ท๐๐๐ ๐ฝ๐๐ฟ๐ฒ ๐ฐ๐ฟ๐ฒ๐ฎ๐๐ถ๐๐ฒ ๐ณ๐๐ป!
Have you tried this trick? Share your thoughts in the comments! Let's chat and swap design hacks. ๐๐ฌ
Posted on January 9, 2024
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
November 30, 2024
November 30, 2024