[Boards: 3 / a / aco / adv / an / asp / b / bant / biz / c / can / cgl / ck / cm / co / cock / d / diy / e / fa / fap / fit / fitlit / g / gd / gif / h / hc / his / hm / hr / i / ic / int / jp / k / lgbt / lit / m / mlp / mlpol / mo / mtv / mu / n / news / o / out / outsoc / p / po / pol / qa / qst / r / r9k / s / s4s / sci / soc / sp / spa / t / tg / toy / trash / trv / tv / u / v / vg / vint / vip / vp / vr / w / wg / wsg / wsr / x / y ] [Search | Free Show | Home]

Overlaying colour and texture

This is a blue board which means that it's for everybody (Safe For Work content only). If you see any adult content, please report it.

Thread replies: 12
Thread images: 1

File: 1449438442757.jpg (186KB, 1000x800px) Image search: [Google]
1449438442757.jpg
186KB, 1000x800px
1) What's the best way to add a texture to a simple background colour or gradient?
2) How would I achieve an effect like the background of this login screen?

I've been a kinda crappy hobbyist for a while, and I'd like to get better. This type of effect looks pretty good, and is somewhat commonly used.
>>
pretty easy to do in PS, grab your base image as a base layer and slap a new layer ontop, fill it with color of your choice, set layer to 'overlay' :^) for a more uniform look set the base image as black and white
>>
>>249927
it can be easy inspired by that.
create a form first. after that, change the padding styles. then add a background with linear-gradient (you can see on the stackoverflow)

you should know the css and I guess, you already know.

You can use the linear gradient effect in css.

>>249941
> pretty easy to do in PS,
yes but he should write this in html/css, I guess
>>
>>249945
Not on about the form, I'm talking about the background
>2) How would I achieve an effect like the background of this login screen?
>the background of
>>
>>249941 Doing this loses detail and doesn't give the correct effect at all. Make sure you know what you're doing before "helping" OP.

and fuck off with your cancerous memeface
>>
>>249941
how do you make it semi transparent i can only eraser from all angles
>>
CSS allows the use of blend modes now; they work like the ones in Photoshop.
https://css-tricks.com/basics-css-blend-modes/

There are few compatible browsers, though, so I guess your best bet would be using a background image made in Photoshop.
>>
Here's the original PSD. No HTML example.
http://ge
.
tt/9g6VbBV2/v/0
>>
>>249952
I already told it

with linear background effect
>>
>>249992
You don't know what a linear gradient is, do you?
>>
>>250018
Not him but that actually is a linear gradient, it just doesn't look like it because of the lighting in the pic.
>>
>>250030
Check the PSD posted by >>249969
It's not linear because you can make out curvature of the upper-left purple bloom, and some of the lower right.
Thread posts: 12
Thread images: 1


[Boards: 3 / a / aco / adv / an / asp / b / bant / biz / c / can / cgl / ck / cm / co / cock / d / diy / e / fa / fap / fit / fitlit / g / gd / gif / h / hc / his / hm / hr / i / ic / int / jp / k / lgbt / lit / m / mlp / mlpol / mo / mtv / mu / n / news / o / out / outsoc / p / po / pol / qa / qst / r / r9k / s / s4s / sci / soc / sp / spa / t / tg / toy / trash / trv / tv / u / v / vg / vint / vip / vp / vr / w / wg / wsg / wsr / x / y] [Search | Top | Home]

I'm aware that Imgur.com will stop allowing adult images since 15th of May. I'm taking actions to backup as much data as possible.
Read more on this topic here - https://archived.moe/talk/thread/1694/


If you need a post removed click on it's [Report] button and follow the instruction.
DMCA Content Takedown via dmca.com
All images are hosted on imgur.com.
If you like this website please support us by donating with Bitcoins at 16mKtbZiwW52BLkibtCr8jUg2KVUMTxVQ5
All trademarks and copyrights on this page are owned by their respective parties.
Images uploaded are the responsibility of the Poster. Comments are owned by the Poster.
This is a 4chan archive - all of the content originated from that site.
This means that RandomArchive shows their content, archived.
If you need information for a Poster - contact them.