Adding the new rupee symbol to your website.
27th January 2011

Prof Udaya Kumar with Ron
Prof Udaya Kumar with Ron

It was indeed a pleasure to see the new Indian rupee symbol come onto the world stage. It makes me proud as an Indian. Having met the creator Prof.Udaya Kumar from the Design School, IIT Guwahati I know its an excellent well thought out symbol creating a perfect balance between devnagri and english symbolism.

Being a web based company the question naturally occoured that now how do we use this symbol online. There are a lot of version available online. We like to use the rupee foradian available here

The rupee font works on a server-side font principle i.e. the font resides on the server and not on your computer unlike other fonts we see on webpages. This technique is mainly used to create language based websites and is useful for this purpose as well.

Step1: Download the rupee fonts

This contains
Rupee_Foradian.woff and

Upload these to a folder on your server named rupee.

Step 2: Add the rupee font definitions to an external style sheet.

font-family: 'Rupee Foradian';
src: url('../rupee/Rupee_Foradian.eot');
src: local('Rupee Foradian'), url('../rupee/Rupee_Foradian.ttf') format('truetype'),
url('../rupee/Rupee_Foradian.woff') format('woff'),
url('../rupee/Rupee_Foradian.svg') format('svg');
font-weight: normal;
font-style: normal;

Now you may use it to create different styles just like any normal font.


.yellowrupee {
font-family: "Rupee Foradian";
font-size: 18px;
font-style: normal;
font-weight: bold;
color: #ff0;
text-decoration: none;

Step 3: using the span within the document.

<span class="yellowrupee">`</span>

The ` symbol (the key to the left of 1 and above the tab key below the tilde ~) is used where you need the rupee symbol to appear.

Its as easy as that. Ofcourse there might be comflicts on different servers so do post here if you encounter any problems.


Visit us at

View our work at

Related Posts
Why some clients thrived during lock down and some did not.
8th August 2020   |   

As a part of a business that interacts with other businesses across industries, on a daily basis, we have a bird’s eye view on how our clients are handling the lockdown. The good news is most of them handled it quite well. It is heartening to s...

Continue Reading
A career as a web design professional in India. List of web design courses and institutes in India.
2nd January 2020   |   

As a web design professional and owner of a web designing firm, I have to be consistent with the ever-changing Web Design Industry. Out of curiosity, I researched about the available Web Designing and Development courses in India. Here is the list...

Continue Reading
The Personal Data Protection Bill 2019 – Implications for online business
18th December 2019   |   

The Personal Data Protection Bill, 2019 was introduced in Lok Sabha by the Minister of Electronics and Information Technology, Mr. Ravi Shankar Prasad, on December 11, 2019. The Bill seeks to provide for protection of personal data of individuals, ...

Continue Reading
Technology is easy. Changing mindsets is difficult.
17th November 2019   |   

We are often caught in the middle of a silent battle happening within our client’s businesses. The battle is between an older generation clinging to a fixed way of doing things and a new generation eager to implement the latest technology, impati...

Continue Reading
Book Reco – What It Takes - Lessons in the Pursuit of Excellence by Stephen A. Schwarzman
24th April 2019   |   

Most autobiographies tend to be written to portray the subject in the best light, glossing over the bad parts and highlighting the good ones and this one is no different. However what makes this such an interesting read is simply the author’s ext...

Continue Reading
The best at website design in India
Connect with us on      
© 2021 Miracleworx Web Design Mumbai. All Rights Reserved.
Quick Enquiry