design blog - graphic and web articles

graphic and web design tutorials



Splash Discount Label in Photoshop Print E-mail

splash discount label header




Let's create a splash discount label today you can use for your website, online shop or simply as a web banner. This simple splash discount label tutorial teaches how to use brushes, save your image in PNG format and other important functions in Photoshop.



1) The very first thing to begin with is to click here to download Ink splash brushes and install them into Photoshop. Just double click the downloaded Dreevoo_com_ink_drips.abr file and they will get installed automatically. Quit and start Photoshop again.

Create a new Photoshop document, setting the Width and Height of the canvas to 500 pixels


splash discount label 01


2) Select Create a new layer button to make a new layer


splash discount label 02


3) Select the Brush Tool from the left menu


splash discount label 03


4) Right click on the canvas and find our Splash brushes we just added. Find the Ink splat 519 brush and select it

(You may note newly added brushes are at the bottom of the list)

Set the brush Size to 500px


splash discount label 04 


5) Change the Foreground colour to a bright one of your choice


splash discount label 05


6) Left click on the canvas to draw a single Ink Splash


splash discount label 06


7) Select the Eraser Tool


splash discount label 07


8) Start erasing all the spots and little lines around our main splash to form our label


splash discount label 08


9) Now, select the Smudge Tool from the left menu


splash discount label 09


10) Right click on the canvas/document and change the Smudge size to 13px and Hardness to 100


splash discount label 10


11) Once done, just click inside our splash, hold the mouse button and drag it down to create a leaking effect. Repeat it about 3 times


splash discount label 11


12) We will create a transparent text now, so select the Horizontal Type Mask Tool from the left menu

splash discount label 12


13) Type some text in the centre of the label (see image below)

splash discount label 13


14) Once typed, click the Commit button on the top panel

splash discount label 14


15) Hit Delete on your keyboard to delete the text selection

splash discount label 15


16) Repeat the steps 13-15 to add additional text

Once done, hit Ctrl + D to deselect selection

splash discount label 16


17) We will add some more cool looking elements, so select the Line Tool from the left menu


splash discount label 17


18) Select the Fill pixels option from the top panel (as seen on the image below)


splash discount label 18


19) Then, draw a few lines on the top of the text


splash discount label 19


20) We will now get rid of the space around our label, so choose the Crop Tool


splash discount label 20


21) Select the crop area to just touch the edges of our splash label (see image below)

Hit Enter to to crop


splash discount label 21


22) Next step is to create the transparency effect, so set the Opacity of label layer to 80%

Right click the Background layer and select Delete in order to remove the white background


splash discount label 22


23) From the top menu go to File >> Save for Web and Devices

Choose PNG-24 as a file type and check the Transparency radio button (see image below)

Hit Save to save our transparent splash discount label somewhere on the computer in the PNG format


splash discount label 23


24)  PNG format we just created has not got any background, so you can paste our discount label on any picture like on our example below.

Please let us know if this effect is cool or not in the comment form below. Thanks

splash discount label 24




Author: mat

Website: tutorial




submit tutorial to us






Covering all UK area: Bedfordshire, Hertfordshire, London, Buckinghamshire, Northamptonshire, Cambridgeshire, including:
Luton, Hertford, Bedford, St Albans, Stevenage, Milton Keynes, Welwyn, Cambridge, London and more.