Dark CSS

Home
Pakistan
Karachi
Dark CSS

💻 - Programming Page
🚀 - Promotion: [email protected]
🌐 - Coding tips and tricks
💡 - Frontend 🤝 UI Design

01/11/2026

Build a Mini Quiz App With JavaScript

Build the quiz game your followers love 🧠

Store the question and options in an object, create a button for each option with createElement, and compare the clicked index with answer.

I tested it: says "Wrong, try again" and says "Correct!".

Create Your First Website: https://kodofy.com

31/10/2026

World Clock With JavaScript and Time Zones

What time is it in London, Karachi and New York? 🌍

toLocaleTimeString takes a timeZone option, so one Date can show any city's time.

Add your own cities from the time zone list.

Create Your First Website: https://kodofy.com

31/10/2026

Build a Snake Game with HTML, CSS & JavaScript 🐍

Want to build your own Snake Game from scratch? Swipe through to see how it's made, step by step. 👉

Here's what's inside:
🔹 HTML structure for the game card, canvas and score

🔹 CSS styling for the page, card and score box

🔹 JavaScript game logic in about 27 lines: movement, food, score, wrap-around edges and keyboard controls

No libraries and no frameworks, just plain HTML, CSS and JavaScript.

It's a great beginner project for learning game loops, arrays and events. 💡

💬 Comment "SNAKE" and I'll send the complete source code to your DM!

💾 Save this post so you can build it later

❤️ Like it if you found it useful

📤 Share it with a friend who's learning to code

Create Your First Website 🚀 https://kodofy.com

31/10/2026

Automatic Numbered Steps With CSS Counters

Numbered steps without typing a single number 🔢

counter-reset starts the count, counter-increment adds 1 on every h3, and content: counter(step) prints it inside a circle.

Add or remove a step and the numbers fix themselves.

Great for tutorials and checklists 🔖

Create Your First Website: https://kodofy.com

31/10/2026

Photo Gallery With HTML figure and figcaption

Stop using a under your images 🖼️

groups an image with its caption, and is the caption itself. Always add alt text for accessibility and SEO.

Which tag did you not know? 👇

Create Your First Website: https://kodofy.com

31/10/2026

100+ Free React UI Components 🔥

Your portfolio deserves better than basic UI. ✨
Copy-paste React components with full source code.

Animated buttons, cards, carousels, sliders, and more.

Free to use in your own projects.

Comment "REACT UI" and I'll send you the link in your DM. 📩

Create Your First Website https://kodofy.com

31/10/2026

Halloween Special: A Floating Ghost in Pure CSS

Happy Halloween from Dark CSS 👻

A round top with border-radius, a zigzag bottom with clip-path, and the second eye is just a box-shadow of the first.

Then float moves it up and down.

Create Your First Website: https://kodofy.com

30/10/2026

Random Password Generator With JavaScript

Generate a 12-character password in 8 lines 🔑

Pick a random position in a list of characters, add that character, and repeat 12 times.

I tested it: each click gave a new 12-character string.

Note: Math.random() isn't secure enough for real passwords. Real apps use crypto.getRandomValues().

Create Your First Website: https://kodofy.com

30/10/2026

Scroll Progress Bar with JavaScript

The reading progress bar on every blog 📖

Divide how far you've scrolled (scrollY) by the total scrollable distance, then use it as the bar's width.

I tested it: 50% at the middle and 100% at the bottom.

The bar itself is just position: fixed at the top.

Create Your First Website: https://kodofy.com

30/10/2026

Customize Your VS Code Cursor in 30 Seconds 🔥

Did you know you can completely change how your VS Code cursor looks and moves? 👀

Go to Settings → Text Editor → Cursor, then try:

✅ Cursor Blinking: Solid or Expand
✅ Smooth Caret Animation: On
✅ Cursor Width: 100

Your cursor becomes bold, animated, and super smooth.

Try it and tell me your favorite style in the comments! 👇

Create Your First Website https://kodofy.com

Address

Karachi

Website

https://kodofy.com/

Alerts

Be the first to know and let us send you an email when Dark CSS posts news and promotions. Your email address will not be used for any other purpose, and you can unsubscribe at any time.