So in this movie, we're gonna talk about Serbia function in CSS image filters, which allows you to convert the image to Serbia. So here's a demo. This is the original image. And this has Judo percent SAP effect. But what happened if I apply 50% of Serbia effect? Well, it will look like this, this image has 50% a sepia effect.
And if you go above and beyond, well, this image has 100% sipi effect, and hundred percent is a by default, and the maximum amount of value you can pass into a function. So zero percent will keep the original image unchanged, and hundred percent will fully convert into CPA affect. Well, obviously, we'll dig deep into code. But before, let me just tell you that what kind of value you can pass into simply a function as a parameter. So here we go. This is our API function.
And you can pass number or percentage value as a parameter. Inside this tab we have function. So now let's go to my quatre where I'll show you this API function in action. So here we go, I'm on equator. And we're gonna work on these last two images, which have a class of image two and Ms three. So let me go to this filter of CSS.
And here I'm gonna apply this filter property and I'm gonna say here sepia. So now if I don't pass any value and leave this parameter empty is going to convert that image to save here Well, that's because if I don't pass any value, hundred percent is actually default value for this APR function. Let me prove you that. So, if I copy it, and paste it into this image, and if I just put here hundred percent, now, if I save it, if I go here, you see that the second image and third image looks identical, because they both have the same exact value, which is 100% separate effect in this case are not passing any value. So it will automatically go into assume that you want hundred percent API effect to the current image and in image three and passing this hundred percent specifically, it means that obviously you want 100% separate back to this Current image, so in zero percent, your original image will remain unchanged.
And in hundred percent, your original image is going to convert fully into step effect. So now let me just go here, and let's make it 50%. So if I just make it 50%, if I save it, now you see that now these have a 50% scipy effect. So zero is the smallest and hundred percent is the biggest, it means that hundred percent means you want to apply 100% sepia effect to that image. Obviously just like percentage, you can pass a number here. So zero percent it means zero.
And if you want to go hundred percent, well just make it one. And it will work. Let me just go here. And you see, it's exactly the same, zero percent and 100% if you want this second used to be 50% because 0.5 and that's 50% let me just clear and say zero, percent and 100%. So you can pass percentage or number value as a parameter to this separate function. Also, let me tell you that the same function do not accept any negative value.
So if you try to pass a, let's say minus here, I will that's a negative value. Well, you see this industry is going to actually revert back to its original place. Now this industry do not have any CPA effect. And that's because you passed here negative value and saving function. Do not allow to pass you negative value. Just make sure your number isn't positive.
So let me just go here and see it's working. So yep, this is how you can apply sepia effect on your images using severe function in CSS image filters.