css Audio - Active file-generic CSS - Active Generic - Active HTML - Active JS - Active SVG - Active Text - Active file-generic Video - Active header Love html icon-new-collection icon-person icon-team numbered-list123 pop-out spinner split-screen star tv

Pen Settings

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

+ add another resource

You're using npm packages, so we've auto-selected Babel for you here, which we require to process imports and make it all work. If you need to use a different JavaScript preprocessor, remove the packages in the npm tab.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Use npm Packages

We can make npm packages available for you to use in your JavaScript. We use webpack to prepare them and make them available to import. We'll also process your JavaScript with Babel.

⚠️ This feature can only be used by logged in users.

Code Indentation


Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

HTML Settings

Here you can Sed posuere consectetur est at lobortis. Donec ullamcorper nulla non metus auctor fringilla. Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.

              <link href="https://fonts.googleapis.com/css?family=Amatic SC|Special Elite" rel="stylesheet" type="text/css">
  body {
  background-color: grey;
  border: 2px solid black;
  h1 {
  font-family: Amatic SC;  
  margin-top: 20px;
  .img-border {  
  border: black solid 2px;
  border-radius: 50%;
  .img-border2 {  
  border: black solid 2px;
  border-radius: 50%;
  width: 80%;
  h2 {
  font-family: Special Elite;
  text-align: center;
  margin-top: 6px;
  .container {
  width: 80%;
  margin: 0 auto;
  border: 2px solid black;
  box-sizing: box-border;
  background-color: white;
  .content  {
  text-align: center;
  p {
  font-family: comic sans;
  margin-top: 6px;
<h1 class="text-center">Tribute to Nikola Tesla:<br>-A Forgotten Genius-</h1>
<img src="https://pbs.twimg.com/profile_images/434689377760210944/yS9ZO1G1.jpeg" height="250" class="img-border">
<h2><font size="2"color="black"><i>"Our virtues and our failings are inseparable,<br>like force and matter. When they separate, man is no more."</i></font>
<div class="container content">
  <p><b><u>Nikola Tesla</u></b> was a Serbian-American inventor, electrical engineer, mechanical engineer, physicist, and futurist who is best known for his contributions to the design of the modern alternating current electricity supply system.
<br><br><b><font size="6">--1856--</font></b><br><i>Nikola Tesla Is Born</i><br>
Tesla was born to Serbian parents in the village of Smiljan, Austrian Empire near the town of Gospić, in the territory of modern-day Croatia.
<br><br><b><font size="6">--1875--</font></b><br><i>Tesla Enrolls In Austrian Polytechnic</i><br>
At the Polytechnic school Tesla began his studies in mechanical and electrical engineering.
<br><br><b><font size="6">--1882--</font></b><br><i>Tesla Begins Working For Continental Edison</i><br>
In 1882 Tesla moved to Paris, to work as an engineer for the Continental Edison Company, designing improvements to electric equipment brought overseas from Edison's ideas.
<br><br><b><font size="6">--1884--</font></b><br><i>Tesla Arrives In The USA</i><br>On 6 June 1884, Tesla first arrived in the United States, in New York City with little besides a letter of recommendation from Charles Batchelor, a former employer.
<br><br><b><font size="6">--1885--</font></b><br><i>Tesla Quits Working For Edison</i><br>Tesla claims he was offered $50,000 if he redesigned Edison's inefficient motor and generators, making an improvement in both service and economy. Several months after Edison employed him, Tesla announced that his work was successfully completed. When Tesla asked to be paid, however, Edison seemed astonished. He explained that the offer of $50,000 had been made in jest. "When you become a full-fledged American you will appreciate an American joke," Edison said. Shocked and disgusted, Tesla immediately resigned.
<br><br><img src="https://img.wonderhowto.com/img/80/91/63498017910650/0/why-nikola-teslas-wireless-power-was-fated-fail-due-exploding-airships.w654.jpg" height="250" class="img-border2">
<br><br><b><font size="6">--1887--</font></b><br><i>War Of The Current Era Begins!
</i><br>During the initial years of electricity distribution, Edison's direct current was the standard for the United States and Edison was not inclined to lose all his patent royalties.
<br><br><b><font size="6">--1893--</font></b><br><i>Nikola Tesla and George Westinghouse power the World's Columbian Exposition</i><br>The International Exposition was held in a building which was devoted to electrical exhibits. All the exhibits were from commercial enterprises. Thomas Edison, Brush, Western Electric, and Westinghouse had exhibits. The public observed firsthand the qualities and abilities of alternating current power.
<br><br><b><font size="6">--1901--</font></b><br><i>Construction begins on Tesla's Wardenclyffe Tower</i><br>In June 1902, Tesla moved his laboratory operations from his Houston Street laboratory to Wardenclyffe. However, in 1903, when the tower structure was near completion, it was still not yet functional due to last-minute design changes. Tesla intended for the tower to demonstrate how electrical energy could be transmitted without the need for power lines. A story has arisen that the power consumption could not be metered and Morgan, who could not foresee any financial gain from providing free electricity to everyone, balked. 
<br><br><b><font size="6">--1915--</font></b><br><i>Tesla and Edison ignored by Nobel Prize committee
</i><br>Thomas Edison and Tesla were mentioned as potential laureates in 1915, but it is believed that due to their animosity toward each other neither was ever given the award, despite their enormous scientific contributions. There is some indication that each sought to minimize the other's achievements and right to win the award; that both refused to ever accept the award if the other received it first; and that both rejected any possibility of sharing it—as was rumored in the press at the time. Tesla had a greater financial need for the award than Edison: in 1916, he filed for bankruptcy.
<br><br><b><font size="6">--1943--</font></b><br><i>Nikola Tesla Dies
</i><br>Tesla died of heart failure alone in room 3327 of the New Yorker Hotel, on 7 January 1943.
  <p class="text-center">Read more about Tesla at <a href="https://en.wikipedia.org/wiki/Nikola_Tesla"> Wikipedia</a> or<a href="https://worldhistoryproject.org/topics/nikola-tesla"> WHP</a>
(World History Project)
🕑 One or more of the npm packages you are using needs to be built. You're the first person to ever need it! We're building it right now and your preview will start updating again when it's ready.
Loading ..................