The latest articles on Forem by Aditi Mohanty (@rheaditi). https://forem.com/rheaditi https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F30643%2Fbb4d0546-4c07-4d7a-83ed-50d1acc8df31.jpg https://forem.com/rheaditi en Aditi Mohanty Mon, 11 May 2020 18:21:26 +0000 https://forem.com/rheaditi/curated-presets-box-shadow-editor-for-devs-designers-4l6m https://forem.com/rheaditi/curated-presets-box-shadow-editor-for-devs-designers-4l6m <p><a href="https://dev.to/abinavseelan">Abinav Seelan</a> and I built a site to curate beautiful box-shadow based designs we found from around the web - to spark design inspiration when we start new projects. </p> <h2> <a href="http://boxshadows.com/presets?utm_source=dev.to&amp;utm_medium=post&amp;utm_campaign=intro_post_rheaditi">boxshadows.com</a> </h2> <p>It features a list of presets from sources like:</p> <ul> <li>material design (materialize-css) 📃</li> <li>tailwindcss 💨</li> <li>windows 98 🤓</li> <li>minecraft! 👾</li> <li>... and more (even DEV.to 😉)</li> </ul> <p>It also features an in-browser editor that allows you to tweak these presets or create your own designs!</p> <p><strong>View the source here</strong>:<br> </p> <div class="ltag-github-readme-tag"> <div class="readme-overview"> <h2> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--vWogaON8--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://practicaldev-herokuapp-com.freetls.fastly.net/assets/github-logo-28d89282e0daa1e2496205e2f218a44c755b0dd6536bbadf5ed5a44a7ca54716.svg" alt="GitHub logo"> <a href="https://github.com/campvanilla"> campvanilla </a> / <a href="https://github.com/campvanilla/boxshadows"> boxshadows </a> </h2> <h3> create and tweak CSS box-shadows ✨ </h3> </div> <div class="ltag-github-body"> <div id="readme" class="md"> <h1> <a rel="noopener noreferrer" href="https://user-images.githubusercontent.com/6426069/80978746-16395d80-8e44-11ea-887e-b04a715f66fb.png"><img width="425" alt="logo-light-medium-400x70" src="https://res.cloudinary.com/practicaldev/image/fetch/s--_lULwowG--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://user-images.githubusercontent.com/6426069/80978746-16395d80-8e44-11ea-887e-b04a715f66fb.png"></a> </h1> <blockquote> <p>create and tweak CSS box-shadows ✨</p> </blockquote> <a href="https://boxshadows.com/?utm_source=github-readme" rel="nofollow"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--ZB8f0x5T--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://user-images.githubusercontent.com/6426069/80999471-60313c00-8e62-11ea-8682-95a7e82882d4.png" width="600"> </a> <h2> Contributing</h2> <p>Want to raise an issue or pull request? Do give our Contributing page a read. 🤓</p> <h3> First time setup</h3> <p>To set up the codebase, clone the repository.</p> <div class="highlight highlight-source-shell"><pre>git clone https://github.com/campvanilla/boxshadows.git</pre></div> <p>Once the repository has been cloned, install the necessary dependencies.</p> <div class="highlight highlight-source-shell"><pre>npm install</pre></div> <p>To start the development environment,</p> <div class="highlight highlight-source-shell"><pre>npm start</pre></div> <p>View the application at <a href="http://localhost:7335/" rel="nofollow">http://localhost:7335/</a></p> </div> </div> <br> <div class="gh-btn-container"><a class="gh-btn" href="https://github.com/campvanilla/boxshadows">View on GitHub</a></div> <br> </div> <br> css webdev showdev opensource