I need to make an SVG that is to be used as a background-image with "cover", so the tile in the mosaic could be rescaled.
I'd like to have the icon at a fixed size and the posibility to always fill with a background color, because, to make matters more complicated, my image is going to be inside a container that is inside the tile
this is my example
my icon should go inside that red outlined box, fixed size and the background in gray
could i get that done?
I have Gray SVG icons next to each Menu item (inherited from another project) and displaied as background.
I need to show them black or white but I don't how to achieve this.
As backgrounds I can't use fill css property. I tried with filter:brightness(100) to make them white but I loose anti-aliasing (and analogue with filter:brightness(0) to make them black).
Mask has still serious compatibility issues (e.g. Firefox does not allow external svg).
I tried also to import them as data-uri with LESS feature, but it was unuseful, so.... any suggestion?
I got a RGB332 LCD and a poor MCU to drive it . The MCU do not have a hardware accelerator nor do RGB332 display support an alpha path.
So I used the color "black" as a "alpha color" to deal with icon paste work.Which means I fill the icon color data to background buffer while the data is not black.
The problem I meet is that the icon showed it's own antialiased edge while the background is not black. And the "antialiased edge" just makes an edge effect from the background.
Is there any way to deal with the situation ?
The main problem is that I don't have "Layer" and "Alpha" to do the PS-like merge work.
But the Icons are Pasted to a Frame buffer one by one.
So my solution is :
When each icon is being pasted,I could decide the front/background,
which means I could detect the "antialiased edge" of the icons just
like I have "layers".
After I find the antialiased edges ,I filled the pixels with the
middle color of the front/background.
The LCD is RGB332,and the middle color calculation is just filling
the edge with 75% background color + 25% front color. If the icon
color is carefully designed, you don't even need a float calculation
.
The work maybe not that effective ,but really solved my problem.
I am refering to a older question saying color blending with GDI+
Using GDI+ with Windows Forms, I want to be able to draw with a pen and blend color based on the destination pixel color.
For example, if I draw a line and it passes over black pixels, I want it to be a lighter color (like white for example) so that it's visible. When that same line passes over white pixels, it should be a darker color (black for example) so that it's still clearly visible.
the answers says to use a color matrix for transformation
so i started implementing it..
My image is present in raw data format in rgb48
Gdiplus::Bitmap image(input.width,input.height,input.width*6,PixelFormat48bppRGB,(unsigned char*)rgb48);
Gdiplus::Image *images= image.GetThumbnailImage(input.width,input.height);
Gdiplus::TextureBrush brush(images);
Gdiplus::Pen pen(&brush);
Gdiplus::ColorMatrix matrix={
-1.0f,0.0f,0.0f,0.0f,0.0f,
0.0f,-1.0f,0.0f,0.0f,0.0f,
0.0f,0.0f,-1.0f,0.0f,0.0f,
0.0f,0.0f,0.0f,1.0f,0.0f,
1.0f,1.0f,1.0f,0.0f,1.0f,
};
Gdiplus::Graphics gfx(&image1);
Gdiplus::ImageAttributes imageAttr;
imageAttr.SetColorMatrix(&matrix);
gfx.DrawImage(images,Gdiplus::Rect(0,0,input.width,input.height),0,0,1024,1024,Gdiplus::UnitPixel,&imageAttr);
I am not getting what i expect..Can some one help me in finding the mistake i m doing.
You can use the alpha component of a color to specify transparency, so that colors can be combined. However, if you want the combination to be something other than the alpha blend, you must draw the pixels yourself. You could first draw into a transparent bitmap, then render that onto the destination pixel by pixel.
For some reason this PNG with a transparent background shows up with white edges but only when on a grey background of nearly the same shade, it's fine on black or light grey.
It's 24bit file and done the same way I done many times before in photoshop with no problems.
It is because it is antialiased against a white background. Try saving your PNG in proper 32 bit?
The antialiasing of the letters did not use any alpha value, they just rendered against your default background color. Anyway, it doesn't look fine on black, I saw the hard antialiased pixels immediately ;)