This theme was made with fansite (resource, rp, ect) blogs in mind, but you can easily edit this theme to fit any style. Like this theme? Consider adding a tip on payhip.
Basic - Advanced HTML to edit depending on what you’re editing. Please reblog or like if using. And let me know if you come across any issues.
nothing needs to be changed in the code, everything can be changed in the customize panel!
terms:
reblog if using
do not touch the credit
all terms / faq
credits listed in the code / credits page
please consider supporting me ♡
blog name !! important
make sure you fill out the blog name field, this is what will show on the top of all your original posts. to clarify: your blog name is your blog’s url - for example: phantomcodes
responsiveness
when the browser window gets too small the sidebar will disappear and become toggleable, the sidebar toggle button will appear on the top right below the day/night button
the pagination will move to the bottom of the page below the posts
updates tab
the updates tab has up to 6 updates each with an icon, optional title, & text and space for a separate text section
leave the 'update 1' field blank if you don't want the updates tab
general notes
many things will not show up if they’re left empty, for example: if you don’t want the title stats leave the title stat fields blank, etc.
reminders
remember tumblr’s customize panel is buggy, toggle the options on/off before saving. similarly some things will not appear in the customize panel preview - save and exit to view your changes
i’m still on semi-hiatus, i’ll be around for questions but please check my faq, answered asks, etc. before asking.
hello, loving this blog header!! Please teach me how did you make the colouring isolation this way.
thank you!! below the cut, i'll show you how i made my current blog header!
as far as my headers go, this was on the simpler side! the most important thing for something like this to work is minimal movement, comfortability with using keyframes (only if there's a lot of movement), and if you're going for a more monochromatic look like this, a scene with pre-existing colors that either align with the colors you want to focus on OR colors that can be easily manipulated into the colors you want!
this is my gif sharpened but before any coloring (640px x 360px for header dimensions):
i knew this scene would work well because the psd i use for law & order really emphasizes blues (and turns greens into blues) and because there's minimal movement from mike and the camera itself. once i apply my psd, this is what i have:
now, the header would have been just fine like this, but i really wanted mike to pop (shocking, tumblr user mikelogan wants mike logan to be the main focus). to do this, i decided to use the eyedropper tool (e) to select a blue shade from elsewhere in the gif. i think i picked from the wall right behind his head, but may have adjusted it a bit. create a new layer (ctrl+shift+n) above your coloring layers, equip a soft brush, and set the blending mode of the layer to color. don't be afraid to play around with the blending modes though!
now, what you're gonna do is one of two things. either color the entire canvas or color everything around mike's general outline. because there's minimal movement, i opted to do the former and colored the entire canvas. this is what that looks like:
blue 🩵
lmao anyway, now we're gonna add a layer mask using the highlighted button at the bottom of your layers panel:
as you can see in the above screenshot, i then used a black brush (black removes the layer, white adds it back) to color over mike, thereby removing the blue coloring from him. i liked how the coloring looked over his tie, so that's what that white spot is in the middle at the bottom.
because he doesn't move much, no keyframes were necessary, but in a gif with more motion, they can help a lot. check out the keyframes tag on @gifmakerresource for more info on how to use layer mask keyframes for coloring!
the only other thing left was adding the torn paper edge at the bottom of the header. i've walked through how to do this in other header tutorials here and here!
if you have any additional questions on this tutorial or anything else, just let me know!
just wanted to share an update on my past gif actions since i no longer use that anymore. there a bunch of actions out there but if anyone is curious on my process <3
action includes:
load files fast: open with image sequence with frame rate delay of 25 (you'll need to configure this to your own folder)
6 sharpening actions
brighten: duplicates smart object sets the mode to "screen" i use these for dark scenes
frame delay: convert layers in video timeline to frame layers in frame animation and sets frame delay to 0.04
convert to video timeline: layers in frame animation are put into a smart object in video timeline
text: sets a drop shadow and stroke setting to text
download here // crop presets // psd
+small tutorial w/ video under
Load Files Fast action opens up a folder where you put your own screencaps in and loads the caps in PS and makes it into a smart object. You will need to configure this yourself since it uses my own folder. Click on Load Files Fast, select "Record" button and then choose File > Open, navigate to the folder that you use to store your screencaps, select the first cap, click on the "Image Sequence" option on the bottom right of the dialog box and then click "Open". It will then ask you to specify the frame rate, I use 25, then click OK. Then you click on the "Stop" button and your action is saved. [video on how here]
After it is put into a Smart Object, I use one of my crop presets I've made. To load them into Photoshop, click on the down arrow next to the crop bottom, click Load Tool Preset and select my preset.
Then I choose a sharpening I want to use. I'm either use 'high pass' or the 'sharper w/o grain' one.
OPTIONAL - Brighten action, brightens the scene using 'Screen' mode. I use these for really dark scenes.
After that I color the gif and add text if needed.
If I want to change the frame delay, I use the 'frame delay' action and set my delay to 0.04 and then save the gif!
If you do decided to use the frame delay action, you won't be able to change the coloring and text once its in frame animation. So you can decide to do your coloring/text after you use this action so you don't have to go back and forth if you decide you want to change your coloring or text.
Hello! I was wondering if you still the dimensions for this post https://www.tumblr.com/mikelogan/764597806101053440/tj-mikelogans-halloween-2024-event-day-17-poc-in
hi! i can do you one better and provide you the template i made!
the post in question
MEDIAFIRE DOWNLOAD
but if you don't want to download the template for any reason, the dimensions in order (right to left, top to bottom) are as follows:
rectangle 1: 177px x 216px
rectangle 2: 178 x 250
rectangle 3: 177 x 216
rectangle 4: 177 x 280
rectangle 5: 178 x 246
rectangle 6: 177 x 280
let me know if you have any additional questions, i'll be happy to help!
Hi! I feel like I haven't seen an updated gif-making tutorial in a hot minute, or there are ones that I find that are how I do not make my gifs at all. LOL. I want to bring about the resurgence and renaissance of the beautiful world of Tumblr, and giffing.
This is (hopefully) going to be a helpful resource to those starting out. I don't know if I'm the greatest in the world at explaining, but I hope it's a good starting point!!
To start out, here's what you'll need:
Photoshop! (you can definitely, certainly, purchase the wonderful products that Adobe has to offer. It would be a shame if someone were to give you a link to get that product without purchasing a subscription).
Video Screencapping Software (I use KMPlayer, have always used KMPlayer, so it is what I will link for you here. There is also VLC).
An absolute love for the game. Saluting emoji, etc.
Here is the google doc to the tutorial!
If anything is confusing, or I can be helpful by rewording or explaining, please send me a message and let me know!!!
Hello! I was wondering if you still the dimensions for this post https://www.tumblr.com/mikelogan/764597806101053440/tj-mikelogans-halloween-2024-event-day-17-poc-in
hi! i can do you one better and provide you the template i made!
the post in question
MEDIAFIRE DOWNLOAD
but if you don't want to download the template for any reason, the dimensions in order (right to left, top to bottom) are as follows:
rectangle 1: 177px x 216px
rectangle 2: 178 x 250
rectangle 3: 177 x 216
rectangle 4: 177 x 280
rectangle 5: 178 x 246
rectangle 6: 177 x 280
let me know if you have any additional questions, i'll be happy to help!
just wanted to share an update on my past gif actions since i no longer use that anymore. there a bunch of actions out there but if anyone is curious on my process <3
action includes:
load files fast: open with image sequence with frame rate delay of 25 (you'll need to configure this to your own folder)
6 sharpening actions
brighten: duplicates smart object sets the mode to "screen" i use these for dark scenes
frame delay: convert layers in video timeline to frame layers in frame animation and sets frame delay to 0.04
convert to video timeline: layers in frame animation are put into a smart object in video timeline
text: sets a drop shadow and stroke setting to text
download here // crop presets // psd
+small tutorial w/ video under
Load Files Fast action opens up a folder where you put your own screencaps in and loads the caps in PS and makes it into a smart object. You will need to configure this yourself since it uses my own folder. Click on Load Files Fast, select "Record" button and then choose File > Open, navigate to the folder that you use to store your screencaps, select the first cap, click on the "Image Sequence" option on the bottom right of the dialog box and then click "Open". It will then ask you to specify the frame rate, I use 25, then click OK. Then you click on the "Stop" button and your action is saved. [video on how here]
After it is put into a Smart Object, I use one of my crop presets I've made. To load them into Photoshop, click on the down arrow next to the crop bottom, click Load Tool Preset and select my preset.
Then I choose a sharpening I want to use. I'm either use 'high pass' or the 'sharper w/o grain' one.
OPTIONAL - Brighten action, brightens the scene using 'Screen' mode. I use these for really dark scenes.
After that I color the gif and add text if needed.
If I want to change the frame delay, I use the 'frame delay' action and set my delay to 0.04 and then save the gif!
If you do decided to use the frame delay action, you won't be able to change the coloring and text once its in frame animation. So you can decide to do your coloring/text after you use this action so you don't have to go back and forth if you decide you want to change your coloring or text.
hi mia, i saw your gifs in dailyflicks and i was wondering if you could share your subtitles settings (drop shadow included if you use any). thank u in advance 💗 and happy holidays!!
hi, here are my subtitle settings ♡ happy holidays to you too!
your sharpening is amazing. would you mind sharing it? also the coloring tools you use for your gifs?
thank you <3
here is the download for my actions; the one i used for the akotsk gifsets is called "sharper w/o grain" if you don't want to download, the settings are:
1st smart sharpen - amount: 500%, radius: 0.3 px
2nd smart sharpen - amount: 10%, radius: 10 px
camera raw filter - texture: 20, clarity 10
and for my coloring, i usually color each gif differently but for my latest akotsk gifsets i used the same one with some minor adjustments but here is a download if you want to check it out!
Sinners gifset is freaking cool! may i ask you about the last gift blending & coloring, please consider a tutorial.
thank you so much!! i do already have a blending tutorial that you can find here, but below the cut, i'll go more in-depth on the last gif in this set for you!
step one: when blending two or more gifs together, i always create the separate gifs first. once you've made your gifs, convert them to smart objects. my gifmaking process means my gifs are already sharpened, but i haven't colored them yet. to convert to a smart object, select all your layers and right-click on one of them and select "convert to smart object."
step two: create a new canvas. for these gifs, my dimensions were 540px x 540px.
step three: bring both gifs onto the new canvas and change their blending modes to screen. to do this, you'll have to select each layer separately and choose "screen" from the blending modes dropdown menu.
step four (optional): sometimes i change the background layer, which should be beneath both gifs, to black, especially if i'm going to be utilizing layer masks to aid in blending. for this set, i didn't use layer masks (which is pretty rare when blending for me tbh), so i didn't bother doing this step. i find it helps keep the blending smooth and eliminate any potential transparent pixels.
step five: coloring! i kept it pretty simple with this set, so i applied my base coloring to both gifs. unless i'm giffing a scene i've already made gifs of, i typically color everything from scratch and i always start with a blank brightness/contrast layer set to screen (sometimes i alter the opacity depending on the brightness of the scene). from there, i add a curves layer, using the black and white eyedroppers to select the darkest and lightest areas of the gif respectively.
my third step is always a selective color layer where i make the blacks blacker and sometimes add more white to the neutrals, but you have to be careful doing this when giffing people of color as this can whitewash them. for this set, i didn't change the neutrals.
step six: gradient maps! you'll notice in the above screenshots that i'm utilizing clipping masks. that's what the arrows next to the layer visibility signify:
because i didn't color the gifs before blending them (which you could do before converting them to smart objects!), i want to make sure my coloring only affects the gif i'm working on. to create a clipping mask, select your layer(s), right-click on one, and select "create clipping mask." you can also click that downward arrow that's highlighted at the bottom of the layer properties:
anywhomst, for the gif of sammie, i added a gradient map adjustment layer that looked like this (note that unless you're going for an inverted look, the darker color should always be on the left of your gradient map):
and for the gif of stack, just a regular black and white gradient map:
this is what my layers look like at the end:
you can see that each group of coloring is using a clipping mask so those layers only apply to their respective gifs.
and for shits and giggles, here are my settings for the typography:
for the gradient effect, make sure your text color is white, change the blending mode of the text layer to difference or exclusion, and then double-click on the layer to open the blending options. here are those settings:
the final step for the offset outline is to duplicate your text layer and, making sure it's above your original text layer, turn off all layer effects, change the blending mode back to normal, rasterize the layer, select the pixels, and edit -> stroke. here's what that looks like step-by-step:
click the eye icon next to effects to turn off the layer effects and choose normal from the blending modes dropdown.
right click the new layer and select rasterize type.
specifically right-click the thumbnail of the layer and choose "select pixels." you'll see the moving dotted line around your text now.
with that selection, go to edit -> stroke. these are my settings:
click okay and then i almost always adjust that layer two pixels to the left and 2 pixels up using the transform tool (ctrl+t).
and with that, we have our final product:
i did adjust both gifs' placement by moving sammie's gif a bit to the left and stack's a bit to the right just so we could see both of their faces more clearly than having them totally overlapping.
if you have any additional questions about this set or any others, check my tutorials tag or shoot me an ask and i'll make a tutorial when i have time!
hi! thank you so much <3 I had a lot of fun with it!
the basic process is the same for all of the colors, but I did change things depending on how it looked over the gif, so I'll start with one color and then show you the adjustments I made per gif.
ask references the gifs in this post. if this is helpful, please like and/or reblog <3 it’s nice to know since tutorials take time! and if you try this out you can always tag me using #emilyblr.
if you’re having trouble seeing, click on the pictures to see the full image!
i. base text layer
First I create a new text layer and make the text white. I like to unify the position and layer effects, as shown above.
I then set the blending mode to exclusion, which gives you this.
Right click on the text layer and select blending options. Use the panel on the left to navigate between effects.
LEFT: Add a drop shadow. I have the blending mode on multiply, opacity at 78%, distance at 2px, spread at 19px, and size at 3px.
MIDDLE: Add a gradient overlay. The gradient overlay and color overlay (right) is what I play around with most. For this particular gif, I liked how the gradient overlay looked with the blending mode set to vivid light.
RIGHT: Add a color overlay. Usually I bring the opacity down regardless of what blending mode I use, but this is another place where I just play around with different options. For this gif, I ended up setting the blending mode to color burn and opacity to 48%.
ii. outline
LEFT: Duplicate your text layer, which will give you the image on the left.
RIGHT: Open blending options and de-select all effects (drop shadow, gradient overlay, color overlay). Go the blending options section and drag the fill opacity to 0%. Add stroke and set the color to white, size to 1px, position to inside, and opacity to 48%. I play around with the opacity for each gif, as what I like often depends on the font and the size of the text.
Use the arrow keys to nudge the outline layer and offset it slightly. I usually move it to the left three spaces and up two spaces, but I also play around with the position depending on the font and size.
iii. individual variations
The process for all the different gifs was the same, but I changed the gradient overlay and color overlay settings based on what worked best for each gif. Figuring out which settings to use is just a lot of trial and error until I find what I like. Below are the specific alterations I made for each gif.
green
GRADIENT OVERLAY
blend mode: hard light
COLOR OVERLAY
blend mode: color burn
opacity: 24%
yellow
GRADIENT OVERLAY
blend mode: linear light
COLOR OVERLAY
blend mode: hard light
opacity: 48%
orange
GRADIENT OVERLAY
blend mode: hard light
COLOR OVERLAY
blend mode: linear burn
opacity: 48%
red
GRADIENT OVERLAY
blend mode: vivid light
COLOR OVERLAY
blend mode: normal
opacity: 48%
STROKE
I played around with text effects and ended up liking the "red" text with an outline, so I included those settings too.
size: 1px
position: outside
color: black
And that's it! The rest of the process is the same for each gif. Hope that was helpful! Feel free to reach out if you have questions.
hello, emily! I love your gifs and tutorials! do you mind making a tutorial on making transition like this? thank you :) mcuchallenge/tumblr/com/post/771584811626315776/
hi, sure! from what I can tell, you're asking how to combine multiple scenes into one gif? tutorial will be below the cut. if this is helpful, please like and/or reblog <3 it’s nice to know since tutorials take time! and if you try this out you can always tag me using #emilyblr.
if you’re having trouble seeing, click on the pictures to see the full image!
i. make your individual gifs
here is my photoshop window. at the top you'll see there are three tabs with each of my individual gifs (I don't save the gifs individually and I also decided not to use the second gif I made, thus: untitled-1, untitled-3, and untitled-4). color each gif individually, make sure the dimensions for each gif are the same (in this case, 540 x 540), and set the frame delay to 0 sec. for each gif.
ii. group gifs (optional)
to make it easier on the eyes, you can create a group for each gif. select all your layers by selecting your first layer at the bottom, holding the shift button, and selecting the last layer at the top (see top right; all visible layers are selected). then press the folder button to create a group and name the group. I usually name the episode, which is why this one is 109. do this in each tab for each gif.
iii. copy frames
go to your second gif (as shown in the photo, my second gif is in the second tab). select all your frames in the timeline (bottom of the photo), then press the hamburger menu in the top right corner of the timeline panel and press copy frames.
iv. paste frames
go back to your first gif and select the last frame in your timeline panel (bottom right). go back to the hamburger menu and press paste frames. you'll get a pop-up that asks which paste method to use. paste after selection will automatically be selected, which is what you are going to use. press ok.
as you can see, the frames for your second gif are now pasted after your first gif. on the right, you can see the two gif groups.
v. repeat
repeat steps three and four with every gif you want to combine.
vi. save your gif
once all of your gifs are in the same window, select all frames in the timeline and click on the arrow next to "0 sec." on any of the frames. select other and enter the frame delay (in this case, I did 0.05 seconds). save your gif as you normally would. if your gif is too big, you can delete individual frames until your gif is under 10MB.
and that’s it! hope that helps. my tag for gif-related things is #em.gif and there are some other tutorials and tips there if anything is confusing, but you’re also welcome to ask questions!
Cherry Laine Icons + Palette #10 requested on k0-fi
- 250x250
- all icons cant fit on this post but they can be seen here on my icons page
- please like or reblog if you take one
- credit isn’t required but it’s appreciated
- Send me a character + palette number and I’ll make you icons 💕
✨ GREETINGS , LUV'D 1S . this week's content is a bright & colourful psd that gives your images a very vibrant and saturated aesthetic . i always make sure that my colourings are poc friendly , so feel free to adjust the layers / opacity to fit your vibe — just don't edit & redistribute or claim as your own . as always , a like + reblog would be greatly appreciated 🌞🍹
click the source link to download this colouring.
sad resources @sadresources - Tumblr Blog | Tumgag
