andre/30-seconds-of-code
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update format

Browse Source
This commit is contained in:
Angelos Chalaris
2020-04-30 13:21:04 +03:00
parent d9fd2d23c3
commit 2fbd3e0737
55 changed files with 412 additions and 571 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
snippets/etched-text.md
View File

@ -5,6 +5,10 @@ tags: visual,intermediate
Creates an effect where text appears to be "etched" or engraved into the background.
- `text-shadow: 0 2px white` creates a white shadow offset `0px` horizontally and `2px` vertically from the origin position.
- The background must be darker than the shadow for the effect to work.
- The text color should be slightly faded to make it look like it's engraved/carved out of the background.
```html
<p class="etched-text">I appear etched into the background.</p>
```
@ -17,9 +21,3 @@ Creates an effect where text appears to be "etched" or engraved into the backgro
color: #b8bec5;
}
```
#### Explanation
- `text-shadow: 0 2px white` creates a white shadow offset `0px` horizontally and `2px` vertically from the origin position.
- The background must be darker than the shadow for the effect to work.
- The text color should be slightly faded to make it look like it's engraved/carved out of the background.