3D Text in Sass

Developer
Bookcasey
Size
2,766 Kb
Views
26,312
  1. 3D Text in Sass Previews
  2. 3D Text in Sass HTML Codes
  3. 3D Text in Sass CSS Codes

How do I make an 3d text in sass?

3D text effect using CSS3 text-shadow made easier to maintain with @for directive in Sass. Inspired by @mdo.. What is a 3d text in sass? How do you make a 3d text in sass? This script and codes were developed by Bookcasey on 13 September 2022, Tuesday.

3D Text in Sass Previews
IQ Test

3D Text in Sass - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>3D Text in Sass</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <h1>3D Text in Sass</h1>
<p>Inspired by <a href="http://markdotto.com/playground/3d-text/">@mdo</a></p>
</body>
</html>

3D Text in Sass - Script Codes CSS Codes

h1 { text-shadow: 0 0px 0 #c9c1c1, 0 1px 0 #c2b9b9, 0 2px 0 #bbb1b1, 0 3px 0 #b4a8a8, 0 4px 0 #ada0a0, 0 5px 0 #a59898, 0 6px 0 #9e9090, 0 7px 0 #978888, 0 8px 0 #908080, 0 8px 8px rgba(0, 0, 0, 0.5); font-size: 72px;
}
h1, p, a { color: #FFF5F5; font-family: Futura, sans-serif; text-align: center; text-transform: uppercase; border: none; outline: none;
}
html { height: 100%; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2M5MjMxYSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzk0MGEwMyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #c9231a), color-stop(100%, #940a03)); background: -moz-linear-gradient(top, #c9231a, #940a03); background: -webkit-linear-gradient(top, #c9231a, #940a03); background: linear-gradient(to bottom, #c9231a, #940a03);
}
3D Text in Sass - Script Codes
3D Text in Sass - Script Codes
Home Page Home
Developer Bookcasey
Username bookcasey
Uploaded September 13, 2022
Rating 4
Size 2,766 Kb
Views 26,312
Do you need developer help for 3D Text in Sass?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Bookcasey (bookcasey) Script Codes
Name
English words that are also Hex colors
Scandinavian Sweater Pattern
Full bleed background images with CSS3 filter
A Pen by bookcasey
Zero Element SMPTE color bars
Shiny Plastic Text
A Pen by bookcasey
Harsh
Trendy Shadow in CSS
Pure CSS one-element printer paper
Create amazing captions with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!