Samreen | Frontend Dev @dev_samreen

-- Frontend Developer | HTML & CSS -- Laravel Intern --Want to Freelance on Fiverr 🔗 https://t.co/oRnU2ruOZ0 fiverr.com/samreenzafar Pakistan Joined June 2025

Tweets

77
Followers

11
Following

59
Likes

81

Samreen | Frontend Dev @dev_samreen

a week ago

Media Queries (Responsive Design) 👉 Use @Media to make sites responsive. 👉 Breakpoints: 576px (Mobile), 768px (Tablet), 992px (Laptop), 1200px (Desktop). 📱 Mobile-First → min-width 🖥️ Desktop-First → max-width #CSS #ResponsiveDesign #Frontend

0 0 0 15 0

Samreen | Frontend Dev @dev_samreen

a week ago

🚀 Built a Button Hover Effects project using just HTML + CSS 🎨 👉 Pure frontend ✨ no JS needed 👉 Clean + responsive design 🔗 Check it out here: [github.com/samreen-fronte…] #HTML #CSS #Frontend #WebDev

0 0 0 15 0

Download Image

Samreen | Frontend Dev @dev_samreen

a week ago

Just built a Simple Landing Page for a product/service! Hero section Call-to-action button Fully responsive & easy to customize Check it out on GitHub: [YOUR_REPO_LINK] #WebDevelopment #HTML #CSS #LandingPage #Frontend

0 0 0 23 0

Download Image

Samreen | Frontend Dev @dev_samreen

3 weeks ago

👩‍💻 Hi, I'm Samreen Zafar — a Frontend Developer & Laravel enthusiast. ✅ Skilled in HTML, CSS & responsive design ⚡ Experience in Laravel CRUD 🌐 Open to freelance projects worldwide #WebDev #Frontend #HTML #CSS #Laravel

0 0 0 65 0

Download Image

Samreen | Frontend Dev @dev_samreen

3 weeks ago

Tags Practice Explored basic HTML tags – headings, paragraphs, lists, links & images. It feels amazing to build from scratch 💻✨ #100DaysOfCode #HTML #FrontendDev

0 0 0 15 0

Download Image

Samreen | Frontend Dev @dev_samreen

3 weeks ago

Layouts Practice 🧩Practiced layouts with Flexbox & CSS Grid Built a simple page with navbar, sidebar & footer. Step by step towards clean UI design 🚀 #CSS #Frontend #WebDevelopment

0 0 0 17 0

Download Image

Samreen | Frontend Dev @dev_samreen

3 weeks ago

Styling Practice 🎨 Styling practice with CSS Worked on colors, fonts, spacing, hover effects & buttons. Loving how small details bring pages to life 🌟 #CSS #100DaysOfCode #Frontend

0 0 0 17 0

Download Image

Samreen | Frontend Dev @dev_samreen

3 weeks ago

Personal Portfolio 🌐Created a Personal Portfolio Page Showcasing my name, bio, skills & projects. This will keep growing as I learn more 💡 #WebDev #FrontendDeveloper #Portfolio

0 0 0 11 0

Download Image

Samreen | Frontend Dev @dev_samreen

3 weeks ago

CSS Transitions & Animations 🔹 Transitions: transition: all 0.3s ease; → smooth property changes on hover or state 🔹 Animations: @KeyframeS, animation-name, animation-duration, animation-iteration-count, animation-delay #CSS #WebDev #Frontend #Animation

0 0 1 11 0

Samreen | Frontend Dev @dev_samreen

3 weeks ago

CSS Backgrounds & Borders 🔹 Backgrounds: background-color, background-image, background-position, background-size, background-repeat, background-attachment 🔹 Borders: border, border-radius, border-style, border-color #CSS #WebDev #Frontend #Design

0 0 0 9 0

Samreen | Frontend Dev @dev_samreen

3 weeks ago

CSS Typography 🔹 Fonts → font-family, font-size, font-weight, font-style 🔹 Spacing → line-height, letter-spacing, word-spacing 🔹 Text → text-align, text-transform, text-decoration #CSS #WebDev #Frontend #Typography

0 1 0 15 0

Samreen | Frontend Dev @dev_samreen

3 weeks ago

CSS Grid 🔹 Container: display: grid; grid-template-columns / grid-template-rows → define structure gap / row-gap / column-gap → spacing 🔹 Items: grid-column / grid-row / grid-area → placement Alignment → place-items, align-content, justify-content #CSS #WebDev #Frontend

0 0 1 32 0

Samreen | Frontend Dev @dev_samreen

4 weeks ago

CSS Flexbox 🔹 Container: display: flex; flex-direction → row | column justify-content → main axis alignment align-items → cross axis alignment flex-wrap → wrap items gap → space between 🔹 Items: align-self flex-grow | flex-shrink | flex-basis #CSS #WebDev #Frontend

0 0 1 28 0

WebDeveloperMentor @MentorWebDev

a month ago

Web development is a book of 10 chapters 👇👇 Chapter 1: HTML 🧱 Chapter 2: CSS 🎨 Chapter 3: CSS frameworks 🧮 Chapter 4: JS ⚙️ Chapter 5: DOM 📃 Chapter 6: Git and GitHub 📲 Chapter 7: React/Angular/Vue⚛️ Chapter 8: Node 🔙🔚 Chapter 9: API and Database 🗄️📄 Chapter 10: Job 🏢

46 163 1K 48K 1K

Samreen | Frontend Dev @dev_samreen

a month ago

CSS Positioning 🔹 static → default 🔹 relative → shift from normal spot 🔹 absolute → relative to nearest positioned parent 🔹 fixed → stays in place (viewport) 🔹 sticky → relative + fix Offsets → top | right | bottom | left Layering → z-index #CSS #WebDev #Frontend

0 0 1 19 0

Samreen | Frontend Dev @dev_samreen

a month ago

CSS Display & Visibility 🔹 display: block → full width, new line inline → flows with text inline-block → inline + width/height none → removed from layout 🔹 visibility: hidden; → hidden but space remains 🔹 overflow: hidden | scroll | auto #CSS #WebDev #Frontend

0 0 1 41 0

Samreen | Frontend Dev @dev_samreen

a month ago

CSS Box Model Content → Padding → Border → Margin 🔹 box-sizing: content-box; (default → width = content only) 🔹 box-sizing: border-box; (width includes padding + border ✅ recommended) * { box-sizing: border-box; } #CSS #Frontend #WebDev

0 0 0 19 0

Samreen | Frontend Dev @dev_samreen

a month ago

CSS Units & Values 🔹 Absolute: px, pt, cm 🔹 Relative: %, em, rem, vw, vh 🔹 Colors: ‣ Names → red ‣ Hex → #fff ‣ RGB → rgb(255,0,0) ‣ RGBA → rgba(0,0,0,0.5) ‣ HSL → hsl(200,100%,50%) #CSS #WebDev #Frontend

0 0 1 31 0

Samreen | Frontend Dev @dev_samreen

a month ago

CSS Syntax & Selectors selector { property: value; } 🔹 Element (p, h1) 🔹 Class (.name) 🔹 ID (#id) 🔹 Grouping (h1, p) 🔹 Universal (*) 🔹 Descendant (div p) / Child (div > p) 🔹 Pseudo-classes (:hover, :nth-child) 🔹 Pseudo-elements (::before, ::after) #CSS #WebDev

0 0 0 43 0

Samreen | Frontend Dev @dev_samreen

a month ago

Who’s hungry? 🍕 I made a Pizza Order Form with HTML + Inline CSS — clean, simple & responsive! Take a look 👇 🔗 [github.com/samreen-fronte…] #CodeNewbie #FrontendDeveloper #HTML #CSS