Today I think that I want to show your programming skills to everyone or create something which can be seen in HTML, CSS through a mini project. You can watch my video on Threespeak. Then I have made a video, in which I will show you that I have made a logo of 3 Speak. This is my first video or series in which I will show you how to make a logo or there will be a complete tutorial.

If you don't understand its details then watch my video, in it I have made the pattern and matching sequence so that you can understand the details.

Let's Start

First of all, I downloaded the 3Speak logo from the internet, then I created a folder and placed that image in it. After that, I created another folder with the name "Languages" and then I created a new file in it with the name "Re-Logo".

After that I entered the boiler plate in the HTML file. With the help of ! And then I renamed my page "Remaking Logo of Sites". It was written in the title.

I created a div in body tag then I written a tag img or called a image that I downloaded or created another div in that div by a putting a class "Threespeak" and then added P tag and wrote my 3 speak text. Then I made that page live and opened it in the browser. The image and text started appearing on one side of the browser. I then added a style tag in the head tag of the HTML. That style tag was used to make our HTML file beautiful. In the style tag, I called our main div and added properties to it. First, I wrote the display property and gave it a value of flex. Then I added the value center to justify-content, and this way it centered from right to left. Then I gave a margin of 300px to center it from top to bottom.

Then I called the div.threespeak and added properties to it by calling the P tag within it. First, I made all the text uppercase using the text-transform property. Then I used a font family which was "Verdana, Geneva, Tahoma, sans-serif". After that, I used the font-weight property and made the text bold. Finally, I used letter spacing and gave it a value of 7px to create space between the text, completing the logo this way.

I have translated my content from my native language(Urdu) to English using ChatGPT.
Source of translating text to english

Conclusion

I have created this content because I am creating a series in which I will show you how logos are made.