---
title: forkonomy's reveal.js additional style set.
description: Add `{%hackmd @siusoon/slide-style %}` in your reveal.js slide deck on HackMD
disqus: hackmd
tags: template
---

<style>

.reveal {
font-size: 24px;
font-family: Georgia, serif;
background: rgb(34,193,195);
background: linear-gradient(0deg, rgba(253,187,45,1) 0%, rgba(34,193,195,1) 100%);
color:#4b0082;
}

a:link, a:visited {
color: rgba(255,255,0,0.9);
}

.reveal blockquote {
display: block;
position: relative;
width: 75%;
background: rgba(255, 255, 0, 0.03);
padding-left:1.5em;
box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.2);
border-left: 2px solid #ffff00;
font-size: 20px;
font-style: italic;
text-align: left;
line-height: 1.8em;
position: relative;
transition: 0.2s border ease-in-out;
}

.reveal h1 {
font-size: 45px;
font-weight: bold;
color: #ffff99;
}

.reveal h2 {
font-size: 36px;
font-weight: bold;
color: rgba(255, 255, 0, 1);
}

.reveal h3 {
font-size: 25px;
color: #ffff99;
font-weight: bold;
}

.reveal h4 {
font-size: 45px;
color: #ffff99;
}

.ref {
font-size: 18px;
color: #4b0082;
}

pre code .wrapper { font-size:17px;line-height: 1.1em;}
pre code .gutter.linenumber { border-right: 3px solid #ffff00 !important; }

.reveal .imgborder {
border: 1px solid white;
}
.reveal img {
border: 2px solid yellow;
}

.card {
display: block;
text-align: center;
margin: 0 auto;
max-width: 55%;
background: rgba(255, 255, 230, 0.93);
color: #333300;
padding: .5em;
font-weight: normal;
font-size: 0.75em;
border-radius: .2em;
box-shadow: .2em .1em .5em rgba(255,255,0,.5);

}

.reveal .controls {
font-size: 8px;
color:rgba(255, 255, 0, 0.43);
}

</style>