Shop Mobile More Submit  Join Login

Profile Presentation: Tips and Tricks

Your profile page can say quite a bit about what kind of person you are, and having a well-designed profile page will help ensure that your visitors leave with a good impression of you and your work. And if you do a remarkably fabulous job at designing your profile, people will not only be impressed, but they will also keep coming back to take another look. In this article, I will go over some useful tips and tricks for making your profile look professional but also personalized! :heart:

This article is mostly directed towards Premium Members, but non-Premium members can still use some of these concepts to personalize their page.

:note: In addition, for those who are new to profile decoration, I highly suggest reading my Decorating Your Profile tutorial first, as it goes over important basics of profile decoration. 

Basic Design Concepts

Before we get started, I first want to go over some basic concepts you should keep in mind when you are designing your profile:

1. Text

If you want people to read the text that is on your profile (whether it's a short About Me section or important information about your commissions), make your text easy to read. Always make sure that there is enough contrast between the background and the text. If you are using a dark background, make sure to either use a light text color or a light-colored Content Holder. (See CypherVisor's Colored Text codes).

Also check to see if your font is too small to read. Usually using one <small> code is alright, but adding more than one makes your font quite difficult to read.

2. Browsers/Monitors

While your profile may look absolutely fabulous to you on your browser, there's always a chance it may not look so great on others. In general, most of the text and content holders look the same on the different browsers. The main thing to care about here is that Custom Box backgrounds now look significantly different on Firefox and Chrome. On Firefox, the background retains its original size, and any overflow is hidden. On Chrome, however, the background size matches itself to the size of your Custom Box Widget.

People also have a variety of monitor widths, which can greatly affect the look of your profile to other people. To ensure that your profile looks fine to all of your visitors, I suggest using wide Custom Box backgrounds (at least 800px across).

3. Content

Finally, try to keep your profile to a reasonable length. You may have an epic computer that can handle the hundreds of thumbs and gifs that you have on your profile, but many of your visitors will not. If your page does not load on people's computers (or worse, if your page crashes their internet), they will not feel particularly inclined to look at your gallery, check out your commissions, drop a comment, etc. 

One way to condense the size of your page is to use scroll boxes on your Widgets (see my tutorial for Scrolling Custom Box Widgets), but you should also think about whether you may just have too many things on your profile. :P

tl;dr What may look pretty to you may not always look pretty for your visitors! Make sure to think about how others may see your page.

Useful Codes

Custom Box Backgrounds

<div class="popup2-moremenu"><div class="floaty-boat"><br><img src="IMAGE URL HERE">div>iv><div class="gr-box gr-genericbox"><br>TEXT HERE</div>

Adding Images

<img src="IMAGE URL HERE">

Adding Linked Images

<a href="URL"><img src="IMAGE URL HERE"></a>

Floating Text/Images

<div class="al">Floating something on the left</div>
<div class="ar">Floating something on the right</div>

For more codes and info, please read CypherVisor's CustomBox + Journal Tips and Tricks.

Creating a Unified Theme

One of the marks of well-designed profiles are a unified or matching theme throughout the page. Premium Members can achieve this through using matching Custom Box Backgrounds, Content Holders, Journals, and Image Decorations

1. Add Custom Backgrounds

By far the most useful tool for profile customization, Custom Box backgrounds can create a completely new look for your profile. It is unfortunately limited by the fact that it can only be applied to Custom Box Widgets, but with a little bit of extra work and some cleverness, you can transform the drab, default green of your regular widgets into something new!


Say that I wanted to feature a few of my favorite tutorials and also have an About Me section in the Deviant ID widget. Unfortunately, my background is the default dA green, which ruins the pink theme of the rest of my profile.

Before by SimplySilent


I added this
Pink Hearts Custom Box Background to my widgets to present the same content, but in a way that matched the rest of my page. In this example, I used the same widgets (the Favorites Widget and the Deviant ID Widget) so that they stayed at the top of my page, but Custom Box Widgets work perfectly for this as well.

After by SimplySilent

For Custom Box backgrounds, browse through:

Backgrounds at DazzlingDecorations
Custom Box Backgrounds at CustomizeYourProfile

2. Match Content Holders

Using matching Content Holders throughout your profile typically makes it look neater and more cohesive. Here are just a few of the many Content Holders that you can use. To find more, browse through the Custom Box Resources folder at CustomizeYourProfile

White Content-Holder Boxes by CypherVisorBlue Content-holder boxes by CypherVisorSharp Sup Text Boxes by TaNa-JoWarning Content-holder boxes (Red N Green body) by CypherVisorLight Yellow Box by SimplySilent

3. Match Journals

If you like displaying your journals on your profile page, then it's probably a good idea to match the design of your widgets with the design of your journal. Journals also offer a much wider variety of designing than regular widgets, and if you know some CSS, you can code awesome designs and hover effects to make your page look fancy!

4. Use Images Decorations

Header Images

While you can use a few different font faces and sizes on deviantART (see LabLayers' dA Font Formatting Guide or Gasara's Basic HTML Formatting Guide), you can create a more personalized look on your profile by using your own header images. With custom header images, you can use any font in any color, shape, or size! Here are some free-to-use examples, but you can always create your own as well:

All you need is an art program that allows for transparencies and text. Save your image as a .png or .gif and upload to your, scraps, or any other image hosting site. Then use the IMG SRC code to add your header images to your widgets.

Divider Images

Repeated use of the same divider images can help create a more unified theme for your profile. Here are some examples of free-to-use dividers. To find more, browse through the Dividers folder at DazzlingDecorations.

Artwork and Profile Navigation

This is where things start getting a little more complex. You've created a nice, unified theme with your profile. Now what?

Well, if you want to take your profile to the next step of awesomeness, you could work with Artwork Directories and CSS Directories. Instead of working with regular old thumbs, buttons, or links, try your hand at something unique!

Artwork Directories

Creating your own menus and directory widgets for displaying your artwork is a wonderful way to not only show off your artwork but also give your page a highly unique and personalized look. While the Featured Deviation Widget or the Newest Deviation Widget can also display your work, making your own directories gives you a lot more freedom with your display.

Here are some examples of wonderfully designed artwork directories. Notice how these sort of displays are significantly more appealing than the regular Deviation Widgets.

Resake by SimplySilent

:iconsambees: (left) and :icontincek-marincek: (right)
Sambees by SimplySilentTincek-marincek by SimplySilent

:iconnaochiko: (left) and :iconmikaley: (right)
Naochiko by SimplySilentMikaley by SimplySilent

The above examples used Content Holders and Custom Box Backgrounds as part of their designs, but non-Premium members can create Artwork Directories (or links to Social Media sites) as well by using only images. Notice once again how these are much more interesting

:iconbun-mi: (left) and :iconmuura: (right)
Cathy2728 by SimplySilentMuura by SimplySilent

CSS Widget Directories

For those who have some experience with coding CSS, CypherVisor's hack for adding CSS to profile widgets can prove to be enormously useful for making your profile uber fancy. Here are just some examples of what you can do:

See the live version on his profile!
Cyphervisor by SimplySilent

See the live version on my profile!

New! Here's a resource and a tutorial for those who would like to create their own Profile Directories:

Make a Profile Directory v.3 (Updated!) by SimplySilent

Learn how to display journals in a Featured Deviation Widget. You'll have to learn how to code a journal on your own, but if you have do some experience with CSS, then I highly suggest trying this out!

Learn how to create a profile directory that links to the widgets on your page. This is very useful for those who have long profiles with a lot of different content because it allows viewers to find exactly what they are looking for without having to scroll through your entire page.

Some free, installable codes for creating one or two columns of buttons.

Examples of Fabulous Designs

Here are some of examples of well designed profiles that I managed to find. All of these use several of the design tips for a unified theme listed above, and they are also clean, simple, and easy to read.

*These screenshots are actually rather old, so the current profiles of the following deviants may look different from the images here.

:iconkawiku: Kawiku uses a very unique, pixelated background that goes wonderfully with the image on the left side. She also consistently uses the green-outlined content holders to give her page a unified look, and the leaf divider as well as the custom header images make her page pop and appear more interesting.

Kawiko by SimplySilent

:iconarichy: Arichy uses a personalized custom background with a fancy image of her username. The repeated snowflake decorations and the white custom box give her profile a very unified look, even with the deviantID image on the right whose color scheme does not match the rest of the page. The use of the blue cursive header images also add a touch of fanciness to the page.

Arichy by SimplySilent

:iconkezzi-rose: Kezzi-Rose takes a very interesting approach to her custom box backgrounds, using different variations of the same two shades of pink. This makes her profile look more dynamic while still maintaining a very cohesive theme. In addition, she uses matching custom boxes, buttons, and header images, and also includes several well-displayed samples of her own artwork.

Kezzi-rose by SimplySilent

:iconscatteredsnow: scatteredsnow does a very nice job of matching her widgets (on the left) to her journal (on the right). By using the same background for both, she ensures that her whole profile matches. The use of her own images add a touch of personality, and the repeated use of decorative borders helps make her profile consistent and matching.

Scatteredsnow by SimplySilent

:icongasara: Gasara does a fantastic job with matching her entire profile page to one color scheme. Note how she uses the Featured Deviation Widget on the left side to format her links and text using CSS. Overall, her page is not only interesting, but also very clean and easy to read.

Gasara by SimplySilent

:iconrosuuri: Rosuuri creates a very unique look to her page through the clever organization of her own images. She uses a bright and bold color scheme that is attention-grabbing and refreshing, and the overall presentation of her page is very clean, sleek, and professional.

Rosuuri by SimplySilent

As you can see, it does take quite a bit of time, dedication, and creativity to pull off a page as remarkable and unique as the ones featured here, but it can certainly be well worth your time if it keeps visitors coming back to see more!

More Resources

Here are some great groups to browse through for profile-decoration resources:

:icondazzlingdecorations: :iconcustomizeyourprofile: :iconpretty-pages: :iconcustombox:

Related Articles and Tutorials

Thanks for reading, and I hope this article was helpful for you! :eager: If you have any questions for me, please feel free to leave a comment below! :heart:

Related Articles:

PE: Decorating Your ProfileDecorating Your Profile
Your profile page is the first thing people will see when they click on your name, so it's very important to leave a good impression! This article will provide some useful tips and tricks for both premium and non-premium members who want to convert their profile into their own, unique page. First off, some Do's and Don'ts of profile decoration:
Use dA's profile widgets-- there are lots of great options to chose from
Show off some art (that's what people are here for!)
Express your personality through colors, stamps, gifs, etc.

Add so many images that your profile takes forever to load
Use garish or headache-inducing colors
Make text difficult to read with dark backgrounds
Non-Premium Widgets

While many widgets are restricted or locked for non-premium members, there are still a variety of great widgets that you can add to your profile, even without a membership.
Gallery: Featured De
PE: A Guide to Gallery CSSA Guide to Gallery CSS
Learn the basics of Gallery CSS with this easy-to-follow guide! :dummy:
In this tutorial, we'll cover:
Adding gallery CSSCoding gallery skinsSome useful resources

Adding Gallery CSS
First of all, some important facts about Gallery Skins:
Only Premium Members are allowed to add CSS to their galleriesSkins can be added to both the Gallery and the FavoritesSkins can only be added to the Gallery folders and Favorites collections (shown in the sidebar) but not the main page itself
Step 1: Click on one of your Gallery or Favorites folders in the sidebar.

Step 2: Click the button called "Folder Options" or "Collection Options."
This button is located at the top right of
Add a Comment:
sillysmartandsuper Featured By Owner Jan 18, 2016  Student Artist
makes me want premium membership core membership ;_; 
Sketchanie Featured By Owner Jan 3, 2016  Student Digital Artist
In the deviant ID box, how did you get your User name to show? Whenever I try all I get is the Beta tester star...
lydiakencana Featured By Owner Dec 28, 2015  Hobbyist Digital Artist
Amazing!! Thank you for sharing this :D
A question,, if I decorate my profile page, and one day my premium gets expired, will the profile remains that way? or will everything be screwed up?
Thanks in advance^^
Tigriss3011 Featured By Owner Dec 18, 2015  Hobbyist Digital Artist
I love the art directories! 
HalloweenStreet Featured By Owner Dec 3, 2015  Hobbyist Traditional Artist
I try to add a background to my ID, but it just covers up everything else.

How do I fix this? .~.
SimplySilent Featured By Owner Dec 3, 2015
A background will naturally cover up what is in the widget. You can read the second journal linked at the bottom of this one for more info. :)
ehkido Featured By Owner Nov 15, 2015  Student Digital Artist
Help! How do you remove the profile picture from the ID widget, it's like just a green filler box space I want it to be like a normal empty box.
Autumnique Featured By Owner Nov 21, 2015  Hobbyist Digital Artist
go to your Deviant ID.  Click Profile picture. There should be a text saying clear picture at the top right. click that And save. :)
CNPica Featured By Owner Oct 6, 2015  Student Traditional Artist
can you sent the note to me for deviantID box customization code?
ChocoXGummi Featured By Owner Aug 27, 2015  Hobbyist General Artist
My profile pic and name don't show. ;A; Is there anything I can do to fix it?
onlysoperf891 Featured By Owner Jul 15, 2015  Hobbyist Traditional Artist
Does anyone know how to leave their profile picture as a blank like she did on her deviant ID ; n ;
LINXthepowerful Featured By Owner Jun 17, 2015  Hobbyist General Artist
How do you get the background onto your deviant ID? Is done all through the custom box? If so, can you give the code to me so I can just replace it with my own background? I've never done this so I'm a little lostSweating a little... 

P.S. that goes for all the backgrounds, but I think I got the hang of putting the background JUST on the custom boxSweating a little...   
AnxietySloth Featured By Owner May 24, 2015  Hobbyist General Artist
Is it possible to do the whole skin thing or the directory without knowing anything about coding? because it's not happening for me XDD
miiwua Featured By Owner May 8, 2015
how do I get rid of the empty ID place in the deviantID? 
doggybutt Featured By Owner May 7, 2015  Hobbyist Digital Artist
I cant seem to be able to put images? T.T
LadyMalvoliosander Featured By Owner May 7, 2015
This is a good article that is going to remain firmly in my favourites for the forseeable future.
I'd really appreciate it if someone could give some feedback on the look of my profile. I'm not currently a premium member but I have been in the past, hence some of the widgets.
I will gladly return the favour and/or leave critique on your artwork in return.
HugMeImScared Featured By Owner Apr 25, 2015  Student General Artist
I know how to add the URL thing but what is the ENTER TEXT HERE mean?~ :/
Unbrydled Featured By Owner Mar 12, 2015  Student General Artist
how do you add a background to a non-custom box like " featured deviations" without blocking out the devaitions?
MissJenRose Featured By Owner Jan 25, 2015  Hobbyist Photographer
I used the Add Background Image code to add a background image to my deviantID widget, it shows the background image in the id box, but you can't see anything other than the background image. I think you need to put up a step-by-step guide on how to do this with non-custom widgets.
MissBlackNails Featured By Owner Nov 1, 2014
When my PM ends (I want to be ready and learn and practice this stuff now that I can), I want to add a background to the widgets like you did in the part creating a unified theme<add custom backgrounds<after
I love how the widgets look, I know how to put a background but I can't find how to make the things on the widget visible like you did, the problem is that when I put a background everything on the widget seems to disappear under the background. Can you help me please?
Sorceress-Cia Featured By Owner Jan 17, 2015
May i ask you how you added a custom background on your donation pool?
MissBlackNails Featured By Owner Jan 17, 2015
You just have to put the background code normally and then what you want to add in the donation pool  :)
Sorceress-Cia Featured By Owner Jan 17, 2015
Thank you so much! :3
MissBlackNails Featured By Owner Jan 17, 2015
You're welcome ^^
Mellemon Featured By Owner Dec 5, 2014
Can I ask how you figured yours out ;w; I can't seem to fix that problem also. Everything disappears underneath the background.
MissBlackNails Featured By Owner Dec 5, 2014
Sent you a note :)
Triplet99c Featured By Owner Oct 14, 2014
Gee.. I am pretty confused right now... I found a background I like to use on my favorites widget and stuff like you did. I added the background, and the images are gone, just the text...

Is there anything I can do to fix that?
MerlesLittleSquirrel Featured By Owner Oct 4, 2014  Professional Digital Artist
I am trying to redecorate my profile again, but no matter what custom box background I use I keep getting the symbol for broken links instead of the background, do you know why? :)
Giyb Featured By Owner Sep 24, 2014  Hobbyist Digital Artist
Sorry but, I still can not know where the option to have a custom background to my widget.
Sperkel-Derg Featured By Owner Oct 3, 2014  Hobbyist General Artist
there isn't, you just put it in the little box, and you can only add BG's to custom widgets
TheDarkXelloss Featured By Owner Sep 9, 2014  Hobbyist Digital Artist
How can I do artwork directories as a non-premium member like :iconbunyeol: and :iconmuura: did? 
SimplySilent Featured By Owner Sep 9, 2014
Yes. All you need are the images and the links.
TheDarkXelloss Featured By Owner Sep 12, 2014  Hobbyist Digital Artist
Never mind! I know how to do it, I just didn't knew I could add codes in a regular text box, I though I couldn't find the code box Sweating a little.... Now that I know that, I can take advantage of what I know about coding here in DA! Thanks for writing this! it's really useful! and sorry for bothering you
TheDarkXelloss Featured By Owner Sep 10, 2014  Hobbyist Digital Artist
I see, the problem is I don't know how to link the images :(
Vittarius Featured By Owner Aug 6, 2014  Hobbyist General Artist
I have a question. I know you talked about it, but I'm still not sure. My deviantID looks right on my browser, but today, I visited it form another computer, and everything was misplaced and the background covered the interest box, it looked awful! There's something I can do to fix it? :(
SimplySilent Featured By Owner Aug 6, 2014
Not much you can do about the interest box except for not using a custom box background. The height of the box will vary depending on monitor width and browser, so it'll be really hard (if possible to begin with) to get it to always align correctly. :hmm:
Vittarius Featured By Owner Aug 6, 2014  Hobbyist General Artist
Oh, okay. Thanks for your answer! :)
Cometstruck Featured By Owner Jun 30, 2014  Hobbyist General Artist
As Quintaru mentioned, is there any way for the custom box backgrounds on both browsers to match without losing the quality? I found that by zooming out of my custom box background on it looks the same for both Google Chrome and Firefox, but then it loses its quality. Is there a way around that, or am I just going to have to deal with it? XD

Thank you so much for your time and the tips! :happy:
SimplySilent Featured By Owner Jul 5, 2014
I think you might have to deal with it. Not only is trying to work with Chrome and Firefox annoying, but you also have to realize that it'll look different on wide and smaller monitors, too. I find it best to work with solid color backgrounds or something like stripes where it doesn't really matter what the size is on the background. :)
Cometstruck Featured By Owner Jul 6, 2014  Hobbyist General Artist
Ah, okay! Thank you very much for your time. :)
Zorocat Featured By Owner Jun 29, 2014  Student Digital Artist
I'm trying to put a custom background on my deviant ID and put the text within boxes. It seems to sort of be working but the text boxes are hovering too low down, like they start half way through the image and I tried to shorten the length of the background image but the text boxes didn't budge, do you have a pre-made code for it or something to explain why it could be happening? Thank you! <3
Quintaru Featured By Owner Jun 13, 2014  Hobbyist General Artist
Hey, i don't have premium membership, but i customized my profile using Chrome and everything looks neat and organized.
But when i used firefox and looked at my profile, all my customization on the left looks out of place (images, links and text).

Is there a method to make firefox preview look like chrome's without premium?
SimplySilent Featured By Owner Jun 14, 2014
Even with premium, it's often difficult to make the Firefox layout match that of Chrome's, unfortunately. :hmm:
Land-of-Cod Featured By Owner Jun 1, 2014
(Hello! A lot of your works have helped quite a lot, though I'm only wanting to get rid of that blank square that's meant to be my dA ID picture. Is there anyway to do so? Thank you in advance.)
SimplySilent Featured By Owner Jun 5, 2014
If you use the regular custom box background code, it will cover up the entire dA ID widget. :)
Land-of-Cod Featured By Owner Jun 5, 2014
(Thanks for the help! :) ))
Moiscen Featured By Owner Mar 29, 2014  Student Traditional Artist
Thank you so much for posting this journal! It was super helpful! I really love playing around with custom boxes and CSS; you have such a neat and pretty page ;w; all the examples you have shown are absolutely lovely!
I definitely found the thing about the journal really helpful as well! I was wondering, if you're not too busy, could you maybe possibly give me feedback to make sure my page doesn't look too disorganized?
SimplySilent Featured By Owner Mar 30, 2014
Oh my, you have a lovely page as well! The hover effect for your buttons looks amazing with that water color background, and I love how well your journal matches your page! :love: I think your page looks very neat and professional. :highfive:
lajvio Featured By Owner Feb 2, 2014  Hobbyist Photographer
I have a question about the Profile Directories. I have one, coded and all, but if I would like to have one of the buttons ina different color, how do I do that? Or do I have to use the Profile Directory Creator? :)
SimplySilent Featured By Owner Feb 2, 2014
Depends on the code that you used, but what you can do is add a class to your button element. So add something like class="orange" to your button element, and in the css, type


Insert the color of your choice, of course.
Add a Comment:

:iconsimplysilent: More from SimplySilent


Submitted on
October 8, 2013
Submitted with Writer


41,130 (116 today)
1,366 (who?)