HomeHome  SearchSearch  Rules & Guidelines  Staff List  MemberlistMemberlist  RegisterRegister  Log inLog in  
Announcements

July 3rd, 2017: Canvas Tutorials is currently undergoing a major revamp. Please excuse any hiccups or glitches.


Coming soon


Coming soon

About Us

Canvas creates and supports an IMVU education environment. We offer tutorials and assistance from some of the community's most active and knowledgeable. Tutorials by users, for users!

Staff
Staff Updates
Important Links
Statistics
We have 1420 registered users
The newest registered user is ohsweet

Our users have posted a total of 2591 messages in 157 subjects
Canvas Time
Share | 
 

 3D Text Effect

View previous topic View next topic Go down 
dako

avatar
View user profile
Role : Designer & Coder
Location : Kingdom Hearts
http://redbubble.com/people/kaizaoda

PostSubject: 3D Text Effect Tue Dec 08, 2015 1:11 am


✦ 3D TEXT EFFECT ✦



Programs used in this tutorial:
JSFiddle.net
____________________________________________________________________

Hello everyone! I am Jae-Lin, but please call me Lin. Smile
I am going to be showing you how to make your text shadow more fancy.
______________________________________________________________________________________________________

First of all, (so that the beginners are included in this.) in your code, you are going to type the following.


Code:
Text-shadow: 0px 0px 0px #Hex code/your color


The first 0px is the x axis(back & forth). The second 0px is the y axis(up & down). And the third 0px is the blur. Blur will make it look like the text is glowing if you just leave the first two 0px's at zero like it is.

The more the numbers increase the further or blurred the effect gets.
______________________________________________________________________________________________________

Okay, now that, that is done, let's get onto the  actual 3D effect.
______________________________________________________________________________________________________

✦ Type into the #Nav a:link, #Nav a:visited, #Nav a:active or #Nav a:hover the code below.
For the hex code add the code #78FFF8.
Do not add the semi-colon, but you instead add a comma.

Code:
 text-shadow: -6px 0px 0px #78FFF8,

✦ Hit enter, and space, to get the numbers underneath the top numbers.
For the second color code make it #FF4040 and then you can add the semi-colon.

Code:
 text-shadow: -6px 0px 0px #78FFF8,
                           6px 0px 0px #FF4040;

✦ And that's it. You are done. Smile
____________________________________________________________________

LIVE DEMO (CLICK)
Back to top Go down
dako

avatar
View user profile
Role : Designer & Coder
Location : Kingdom Hearts
http://redbubble.com/people/kaizaoda

PostSubject: Re: 3D Text Effect Tue Dec 08, 2015 1:56 pm

Any questions, or problems please, reply here.

__________________________________
Socials: Instagram | Twitter | DeviantART | Tumblr
-----------------------------------------------------------
- PLAIN -
Back to top Go down
Khaleesi

avatar
View user profile
Role : Student

PostSubject: Re: 3D Text Effect Mon Aug 01, 2016 9:16 pm

Yes thank you! Something I didn't learn in my college class -- LOL. Maybe I will later on 8')
Back to top Go down
dako

avatar
View user profile
Role : Designer & Coder
Location : Kingdom Hearts
http://redbubble.com/people/kaizaoda

PostSubject: Re: 3D Text Effect Mon Aug 01, 2016 9:33 pm

Ah~ You're welcome, haha.

__________________________________
Socials: Instagram | Twitter | DeviantART | Tumblr
-----------------------------------------------------------
- PLAIN -
Back to top Go down
Raavein

avatar
View user profile
Role : Designer & Coder
Location : OK

PostSubject: Re: 3D Text Effect Thu Aug 11, 2016 9:28 am

Helpful, thank you!

__________________________________
Moderator
Semi-Hiatus, Please message/tag another moderator for a prompter response. Thank you!
My Status Thread.

My Timezone: CT / Central
Back to top Go down
dako

avatar
View user profile
Role : Designer & Coder
Location : Kingdom Hearts
http://redbubble.com/people/kaizaoda

PostSubject: Re: 3D Text Effect Wed Oct 19, 2016 5:53 pm

@Raavein
//Wow I succ..
Yo, thank you giving feedback Smile

__________________________________
Socials: Instagram | Twitter | DeviantART | Tumblr
-----------------------------------------------------------
- PLAIN -
Back to top Go down
Tsukeru

avatar
View user profile
Role : Designer & Coder
Location : Australia

PostSubject: Re: 3D Text Effect Wed May 10, 2017 1:14 am

^^

__________________________________
Back to top Go down
Tsukeru

avatar
View user profile
Role : Designer & Coder
Location : Australia

PostSubject: Re: 3D Text Effect Wed May 10, 2017 1:14 am

^^

__________________________________
Back to top Go down
 
3D Text Effect
View previous topic View next topic Back to top 
Page 1 of 1

Permissions in this forum:You cannot reply to topics in this forum
 :: HBAD REALM :: HBAD • Coding-
Jump to: