CSS box-shadow trick!

  1. Using box-shadow to duplicate, so you don’t have to create more divs.
box-shadow:0 120px 0 $eggshell, 120px 0 0 $eggshell,80px 40px 0 $eggshell, 0 80px 0 $eggshell,80px 0 0 $eggshell, 40px 80px 0 $eggshell,40px 40px 0 $eggshell, 0 40px 0 $eggshell, 40px 0 0 $eggshell;

$eggshell, is a SASS way of declaring variables, $eggshell is assigned to the color #F3E9D2.

2. Using box-shadow as shadow and inset-shadow, the most common usage.

box-shadow:inset 10px 10px 0 rgba(#523E6B, 0.2),10px 10px 0 rgba(#523E6B, 0.2);

3. Using box-shadow to make gradient background.

box-shadow:inset 0…


Sushi anyone?

In this pen/piece/work, I used

radial-gradient to draw the Maki(left),

linear-gradient to draw the lines on the tuna, salmon sushi and yellowtail sushi. (center)

box-shadow for seaweed strip on tamago sushi and shadows for the board, green tea cup.

Check this out on Codepen: http://codepen.io/sashatran/full/bgZVdm/

Speed code on Youtube: https://www.youtube.com/watch?v=UzK9Ov3sKh8


You can draw rectangles, squares and circle easily with CSS. But how about a trapezium-like coffee cup shape? This is how you do it.

 width: 100px;
border-top: 250px solid salmon;
border-left: 25px solid transparent;
border-right: 25px solid transparent;

You can play around with the figures, to create different sizes or different shapes.

Codepen: http://codepen.io/sashatran/full/wgYQxz


CSS Girl

I am inspired by graphic, visual design, and cute things. But unfortunately, I am not talented in drawing by hand. I enjoy looking at other designers’ illustrations on Dribbble, and was envious that they could draw such cute and intricate illustrations that are so inviting at the same time.



I’ve never seen a beaver before, so this is what I imagine it would look like :p

Codepen: https://codepen.io/sashatran/full/NdNqPo/

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store