hi! I made this for me but I thought I’d share this. I was hesitant about which category to post to (tutorials or resources) but I decided on this one. tell me if you think I could improve something, and don’t forget to bookmark this post!
happy copy pasting!
text styling
Highlighting
Header text — # Text (supports 6 #)
Big text. — <big>text</big>
Bold text. — **text**
Italic text. — *text*
struckthrough text. — ~~text~~
small text. — <small>text</small>
Differential text
deleted text. — <del>text</del>
marked text. — <mark>text</mark>
inserted text. — <ins>text</ins>
Information
This is an abbr or a definition. (hover the … text to see info) — <abbr title=“ADDITIONAL INFO”>WORD</abbr>
Numbers idk what to call this
O2, CO2 --------------- 2 is a <sub>subscript</sub>
E=MC2, √a2, b2 ------- 2 is a <sup>superscript</sup>
Input
keyboard key like CTRL, kinda has duolingo’s style – <kbd>key</kbr>
Separation
---, or *** — adds a horizontal line that separates text
cool badges
examples:
Modd.io badge's source
<p><a href="https://modd.io">
<img src="upload://pLg0omLve6hzmpeZsS6GVa5FWDr.svg" alt="DESCRIPTION">
</a>--- base64 encoded image</p>
Roblox badge's source
<p><a href="https://modd.io">
<img src="https://img.shields.io/badge/ROBLOX-CREATOR_HUB-keepthis?style=for-the-badge&logo=robloxstudio&labelColor=black&color=darkblue&logoColor=white" alt="DESCRIPTION">
</a>--- SimpleIcons slug</p>
Example badge's source
<a href="https://EXAMPLE.COM">
<img src="https://img.shields.io/badge/LEFT_TEXT-RIGHT_TEXT-keepthis?style=for-the-badge&logo=LOGO_HERE&labelColor=LEFT_COLOR&color=RIGHT_COLOR&logoColor=LOGO_COLOR" alt="DESCRIPTION">
</a>
<!- change EXAMPLE.COM with your link, or remove <a></a> if not needed -->
<!- switch CAPITALIZED text with appropriate values, including DESCRIPTION.-->
to write spaces, slashes, exclamation marks, and many other characters in your badges, you need to use their encoded writings for the badge to work properly. so here's their encoded versions.
shields.io-specific encoding
character | encoding |
---|---|
' ' |
_ |
'_' |
__ |
'-' |
-- |
percent-coding, for every badge provider
character | encoding |
---|---|
':' |
%3A |
'/' |
%2F |
'?' |
%3F |
'#' |
%23 |
'[' |
%5B |
']' |
%5D |
'@' |
%40 |
'!' |
%21 |
'$' |
%24 |
'&' |
%26 |
"'" |
%27 |
'(' |
%28 |
')' |
%29 |
'*' |
%2A |
'+' |
%2B |
',' |
%2C |
';' |
%3B |
'=' |
%3D |
'%' |
%25 |
' ' |
%20 |
more info at Shields.io | Documentation
table of bug reports --- using HTML tables because more user-friendly imo.data
username | title | description | |
---|---|---|---|
biillyyy123 | hello | Lorem ipsum, io buonasera de la baguette. | |
bombingcutie78 | crash when dancing | I danced then crashed. This is very serious. |