---
layout: default
section_id: portfolio
title: SecureDrop Style Guide
---
< div style = "background-color: #034482;" class = "full new" >
< div class = "section-title new" >
< div class = "row" >
< div class = "medium-10 medium-centered columns" >
< h1 class = "wow slideInUp" style = "color: white; font-size: 2rem;" > SecureDrop Style Guide< / h1 >
< / div >
< / div >
< / div >
< / div >
< div class = "full text" >
< div class = "row" >
< div class = "large-8 columns" >
< img class = "lazy" data-src = "../images/projects/securedrop_logo.png" alt = "I2P logo" >
< div class = "spacing" > < / div >
< img class = "lazy" data-src = "../images/projects/securedrop_image_1.png" alt = "Colors" >
< div class = "spacing" > < / div >
< img class = "lazy" data-src = "../images/projects/securedrop_image_2.png" alt = "Typography" >
< div class = "spacing" > < / div >
< img class = "lazy" data-src = "../images/projects/securedrop_image_alerts.png" alt = "Alerts" >
< div class = "spacing" > < / div >
< img class = "lazy" data-src = "../images/projects/securedrop_image_3.png" alt = "Buttons/Badges" >
< div class = "spacing" > < / div >
< img class = "lazy" data-src = "../images/projects/securedrop_image_4.png" alt = "Cards" >
< div class = "spacing" > < / div >
< / div >
< div class = "large-4 columns" >
< div class = "project-intro" >
< p > SecureDrop is an open source whistleblower submission system that media organizations can install to securely accept documents from anonymous sources.< / p >
< p > SecureDrop is employed by many of the world’s leading news organizations to handle sensitive information shared by sources whose safety may depend on complete anonymity. It is used to report about matters of local, national or international significance; sometimes, submissions may concern matters of life and death. How we communicate should reflect the seriousness and importance of these objectives.< / p >
< hr >
< div class = "spacing" > < / div >
< h4 > Date< / h4 >
< p > < span > October, 2018< / span > < / p >
< h4 > Clients< / h4 >
< p > < span > < a href = "https://securedrop.org" target = "_blank" rel = "noopener" > SecureDrop< / a > < / span > < / p >
< h4 > Category< / h4 >
< p > < span > Style Guide< / span > < / p >
< hr >
< a class = "button boxed blog" href = "https://ura.design/" target = "_blank" > < i class = "fas fa-pencil-alt" > < / i > Blogpost< / a > < br / >
< a class = "button boxed black" href = "https://github.com/uracreative/works/tree/main/SecureDrop" target = "_blank" rel = "noopener" > < i class = "fab fa-github" > < / i > Sources< / a > < br / >
< a class = "button boxed identihub" href = "https://demo.identihub.co/securedrop" target = "_blank" rel = "noopener" > < img class = "lazy" data-src = "../images/projects/identihub.svg" > Identihub< / a > < br / >
< a class = "button boxed securedrop" href = "https://uracreative.github.io/securedrop-styleguide" target = "_blank" rel = "noopener" > < i class = "fas fa-globe" > < / i > Website< / a > < br / >
< / div >
< / div >
< / div >
< / div >
< hr >
< div class = "full" >
< div class = "section-title" >
< div class = "row" >
< div class = "medium-10 medium-centered columns" >
< h2 > Related projects< / h2 >
< / div >
< / div >
< / div >
< div class = "related-works" >
< div class = "row" >
< div class = "large-4 columns" >
< div class = "work-wrapper" >
< a href = "reproducible-builds" class = "work" >
< img class = "lazy" data-src = "../images/projects/rb_thumbnail.png" alt = "" >
< div class = "info" >
< h3 > Reproducible Builds Style Guide< / h3 >
< p > Style Guide< / p >
< / div >
< / a >
< / div >
< / div >
< div class = "large-4 columns" >
< div class = "work-wrapper" >
< a href = "thunderbird" class = "work" >
< img class = "lazy" data-src = "../images/projects/tb_overview.png" alt = "" >
< div class = "info" >
< h3 > Thunderbird Style Guide and Usability Study< / h3 >
< p > Style Guide | Usability Study< / p >
< / div >
< / a >
< / div >
< / div >
< div class = "large-4 columns" >
< div class = "work-wrapper" >
< a href = "i2p" class = "work" >
< img class = "lazy" data-src = "../images/projects/i2p_overview.png" alt = "" >
< div class = "info" >
< h3 > I2P Style Guide and Usability Study< / h3 >
< p > Style Guide | Usability Study< / p >
< / div >
< / a >
< / div >
< / div >
< / div >
< / div >
< / div >
