Hi!

I'm Ali/Unix, and I like doing lots of things, one of which happened to be web design & programming;

say Hi to me

sounds

off

dark mode

on

local time

Loading...

local weather

Loading...

country

ir

city

syz

native language

fa

foreign language

en - it

playlist

soundcloud

Designs

designs picture

Click choices below!

Job portal design
Soundcloud design
YouTube design
portfolio design
Pinterest design

can you

hire me?

Yes underline , I'm available for hire and freelance projects; I do everything I can, for example I work with technologies like Tailwind Css TailwindCss icon,   Bootstrap Bootstrap icon,   Sass Sass icon,   Django Django icon,   JavaScript JavaScript icon,  HTMX HTMX icon,  Native Web Component Web Component icon///_hyperscript,  Figma figma icon,  and many interesting libraries.

but how?

you give me your ideas

I bring your ideas on paper

I tell you what I can and can't do

we settle on a final plan

I give you an approximate deadline

and talking about price, it's going to be affordable

you give me your ideas

I bring your ideas on paper

I tell you what I can and can't do

we settle on a final plan

I give you an approximate deadline

and talking about price, it's going to be affordable

through

my lense

Element following mouse move effect

Using css var and 'rotate' properties, you can corelate the mouse move to the element.

long

css stuff

Translate 3D text effect

Wrap the text into a blocked, overflow-hidden container, toggle transform: translate3d(0, 100%, 0): on the text.

Short

css stuff

Ripple effect on button

Create an overlay that scales up with transition when btn is clicked, also overflow-hidden the parent.

Short

css stuff

View transition API with multiple images

By using window.addEventListener('pageswap') and window.addEventListener('pagereveal') you can add and remove viewTransitionName on an element at the last moment, so you don't have to hardcode viewTransitionName on each single image in your page.

Short

web stuff

What is layout shift and how to prevent it

Unexpected layout shifts decreases your website's score in web vital metric, which is crucial for SEO. There're many things you can do to prevent it, one is using skeleton, the exact same size as the actual content that hasn't been loaded yet.

Short

performance stuff

Using ngrok to let others access your localhost

You can easily use ngrok to host your localhost into their public host for free.

Short

web stuff

Offline pages with service workers

By using service workers API you can make your, static, website work offline. It's just a script to install and activate it.

Short

web stuff

Using Telegram API even if the host doesn't let you to

By using Cloudflare worker you can proxy your request; You send the worker the request, and then the worker sends it to Telegram.

long

worKaround stuff

Flashlight in a dark page, a css effect based on mouse coordinates

The easiest way of achieving this effect is by using radial gradient that its position is based on mouse coordinates, and putting it on the whole page.

short

css stuff

Nvidia Geforce Experience error when installing new driver, "an error occurred"!

Download the new version of the driver in Geforce Experience, navigate to 'C:\ProgramData\NVIDIA Corporation\Downloader\' and install the driver manually.

short

software stuff

Upgrade your outdated android phone to a higher android version!

The method consist of installing an unofficial version of android, if the community had already developed a custom android ROM for your specific device model.

long

phone stuff

- April 2024 -