DEV Community: Mahmoud Elaraby

Cool tip 👍😉

Mahmoud Elaraby — Thu, 07 Aug 2025 08:24:09 +0000

Instagram vibe: The gradient background and glowing hover effect mimic trendy social media aesthetics.Simple to use: Just add the glow-btn class to any for instant flair.Customizable: Swap gradient colors or adjust box-shadow for different glow intensities.
👇👇

<button class="glow-btn">Click Me!</button>

<style>
.glow-btn {
  padding: 12px 24px;
  font-size: 16px;
  color: white;
  background: linear-gradient(45deg, #ff0066, #00ccff);
  border: none;
  border-radius: 25px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.glow-btn:hover {
  box-shadow: 0 0 15px rgba(255, 0, 102, 0.8), 0 0 30px rgba(0, 204, 255, 0.5);
  transition: box-shadow 0.3s ease;
}
</style>

Css Trend 😭

Mahmoud Elaraby — Thu, 07 Aug 2025 08:01:33 +0000

CSS trick using backdrop-filter for a frosted glass effect on a navigation bar, giving it a modern, sleek look that's trending in web design:

<nav class="frosted-nav">
  <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">About</a></li>
    <li><a href="#">Contact</a></li>
  </ul>
</nav>

<style>
body {
  margin: 0;
  height: 100vh;
  background: url('https://via.placeholder.com/1920x1080?text=Background') no-repeat center/cover;
  font-family: Arial, sans-serif;
}

.frosted-nav {
  position: fixed;
  top: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.1); /* Semi-transparent base */
  backdrop-filter: blur(10px); /* Frosted glass effect */
  -webkit-backdrop-filter: blur(10px); /* For Safari support */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.frosted-nav ul {
  list-style: none;
  display: flex;
  justify-content: center;
  margin: 0;
  padding: 15px 0;
}

.frosted-nav li {
  margin: 0 20px;
}

.frosted-nav a {
  color: white;
  text-decoration: none;
  font-size: 18px;
  transition: color 0.3s ease;
}

.frosted-nav a:hover {
  color: #ff0066; /* Pop of color on hover */
}
</style>

A nice website for the frontend developers

Mahmoud Elaraby — Thu, 01 Apr 2021 15:31:35 +0000

Link : https://colorhunt.co/
1- What is Color Hunt?

Color Hunt is an open collection of color palettes, created by Gal Shir. Color Hunt started as a personal small project built to share trendy color combinations between a group of designer friends. The collection scaled up and now being used daily as a handy resources by thousands of people all over the world. Color Hunt was created with the goal of celebrating the beauty of colors, and to serve as a go-to resource for color inspiration.

2- Who is it for?

Color Hunt serves thousands of color schemes for many different design and art purposes. The color palettes are being used by graphic designers, artists, illustrators, web developers, fashion designers, marketeers, interior designers, and more. People use Color Hunt to get color inspiration and find the perfect palette for their projects. Anyone can save their favorite palettes, manage their personal collection, and have a quick access to copy the color codes.

3- Who creates the color palettes?

You, the users, are the ones who create the palettes using Color Hunt’s palette creator. The collection is open, and everyone can create and submit their own color combination. That’s how we keep Color Hunt diverse, colorful, social and inspiring. Each palette is a public property and not owned by a specific creator, nor by Color Hunt.

Hey there , should i use linux on vmware for programming , or give me an advice thanks

Mahmoud Elaraby — Mon, 22 Feb 2021 12:14:28 +0000

CSS Frameworks With Most Stars on GitHub ⭐

Mahmoud Elaraby — Wed, 03 Feb 2021 13:37:05 +0000

Bootstrap - 147K ⭐
Semantic UI - 48.9K ⭐
Bulma - 42.4K ⭐
Materialize - 38.3K ⭐
Tailwind - 35.2K ⭐
Foundation - 28.9K ⭐

Which one is your favourite?

3 Useful Websites Everyone Should Know! 2021 🔥

Mahmoud Elaraby — Mon, 25 Jan 2021 17:14:09 +0000

https://t.co/vZrZ3XyPqG
(Send Notes That Self-Destruct)
https://t.co/DSTOyCfqw4
(Username, Domain & Trademark Search.)
https://t.co/XdiEPd7TXO
(Take beautiful, high-resolution screen captures of websites.)

The best programming language is the one you know how to use.

Mahmoud Elaraby — Fri, 31 Jul 2020 07:51:13 +0000