Free Html & CSS Code Editor Online. The Best way to Make Websites with or without Coding



Click on the buttons inside the tabbed menu:

Codes

Here are some Simple Codes which will surely make it easy to make your Website. Type this Code in the place where you want to put and hit Space or Enter.

Activity Code
Bold *Text* (Press Enter or Space after this)
Italic _Text_ (Press Enter or Space after this)
Underline -Text- (Press Enter or Space after this)
Link ~Text~ (Press Enter or Space after this)
Button .button (Press Enter or Space after this)
Image .image (Press Enter or Space after this)
Long Paragraph .text (Press Enter or Space after this)
Colorful Table .table (Press Enter or Space after this)
H1 #Text (Press Enter after this)
H2 ##Text (Press Enter after this)
H3 ###Text (Press Enter after this)
H4 ####Text (Press Enter after this)
H5 #####Text (Press Enter after this)
H6 ######Text (Press Enter after this)
Circle List * Text (Keep a Space between * and the List Item and Press Enter after it)
Square List _ Text (Keep a Space between _ and the List Item and Press Enter after it)
Disc List - Text (Keep a Space between - and the List Item and Press Enter after it)
List Type 1 1. Text (Keep a Space between . and the List Item and Press Enter after it)
List Type a a. Text (Keep a Space between . and the List Item and Press Enter after it)
List Type i i. Text (Keep a Space between . and the List Item and Press Enter after it)
List Type A A. Text (Keep a Space between . and the List Item and Press Enter after it)
List Type I I. Text (Keep a Space between . and the List Item and Press Enter after it)
   
Horizontal Rule --- (Press Enter or Space after this)
   
Copyright Symbol (c) (Press Enter or Space after this)

Templates

Type the Code given below and Press Enter or Space if you want to get the Template Easily. (If You are in a Mobile Device, Press the Enter Button and Ckick on the Backspace Button to Delete the Last Rule.) Once you Typed a Code given below and Press Enter or Space, it will Automatically add the HTML Code for the Template. After that, you should have to Click on the Template Name and Copy the CSS Code to your Clipboard. Then Come Back to this Website and Paste the Copied Code between the Head Tag of your Website's Code which can be got by Clicking on the Source Code Tool.

Template Type Code
Simple Website //simple
Complete Website 1 //website1
Complete Website 2 //website2
Complete Website 3 //website3
Header (1st Style) //header1
Header (2nd Style) //header2
Header (3rd Style) //header3
Body (1st Style) //body1
Body (2nd Style) //body2
Body (3rd Style) //body3
Footer (1st Style) //footer1
Footer (2nd Style) //footer2
Footer (3rd Style) //footer3
   

Tools

Let's Learn about the Tools given above to make your Website Easily without Coding.

Tool Name Work

1) Source Code

To get the Source Code of your Website and to Edit the Elements, Tags, Values and such things if you know HTML Language.

2) Full Screen (Ctrl + Shift + F)

You can get only this Workspace as the Main Screen and it will be set to your Device Width and Height. (Only for Mobile Devices.)

3) Preview

You can Know how your Website will Looks like in your Device. (If this doesn't work quickly, Click on the Preview Screen and Scroll Down.)

4) Print (Ctrl + P)

To get a Printout or a PDF File of your Website.

5) Undo (Ctrl + Z)

To Undo an Action.

6) Redo (Ctrl + Y)

To Redo an Action.

7) Formats

You can Add Headings (H1, H2, H3, H4, H5, H6) and Blocks (Paragraphs, Blockqoute, Div and Pre) Easly by this Tool. You can also Align the Text (Left, Center, Right, Justify) and add Inline Formats (Bold, Italic, Underline, Strikethrough, Superscript, Subscript, Code) by this Tool.

8) Capitalization

To make the Selected Text Uppercase, Lowercase or Title Case.

9) Bold (Ctrl + B)

To Bold the Selected Text.

10) Italic (Ctrl + I)

To Italic the Selected Text.

11) Underline (Ctrl + U)

To Underline the Selected Text.

12) Align Left, Align  Center, Align  Right and Justify

To Align Text to Left, Right and Center. Also can to Justify Text and it will Adjest the Text to the Device Width Equally.

13) Insert / Edit Image

You can use this to Add a Image which is on the Internet or you can Add a Image from our Free Image List. If you want to Add your own one, Upload it to your Cloud Storage like Google Drive, Onedrive or Mega and Make it Public. Then you can get it's Link and Paste it in the Source Tab.

14) Table

To Add a Table. You can also give the Number of Columns and Rows which want to the table by Selecting the Area. You can Sort Table by Ascending or Descending by this Tool.

15) Insert / Edit Media

You can Add Videos to your Website by this Tool Easily. You can also Add YouTube Videos and your own Embed Codes too.

16) Emoticons

To Add Emoji to your Website.

17) Special Character

To Add Special Character. (Currency, Symbols, Arrows, Mathematical, Quotations, Text and much more.)

18) Numbered List

Use this Tool to Add a Number List. (1, 2, 3 / A, B, C / a, b, c / i, ii, iii / I, II, III.)

19) Bullet List

Use this Tool to Add a Bullet List. (Disc, Square, Circle.)

20) Text Color

To Add a Text Color. You can Select the Color which you want to add or you can Enter a Custom Color Code in the given Space if you know Hexadesimal Color Codes.

21) Background Color

To Add a Background Color to your Text. You can Select the Color which you want to add or you can Enter a Custom Color Code in the given Space if you know Hexadesimal Color Codes.

22) Permanent Pen

To Easily Add a Color and make the Text Bold. You can use this Tool to Highlight Important Points for the Benefit of yours.

23) Format Painter

This will Automatically get the Format of a Selected Text and Paste it to Another Text which you Select after Activating this Tool. First you need to Select some Text which has the Format you need to be Copied and then Click on this Tool and Click on the Word which you need to be Replaced with the New Format.

24) Clear Formatting

This will Clear All the Formats of the Selected Area.

25) Insert / Edit Link (Ctrl + K)

To Link some Text, Image or such thing to Another Place. You can Select how it should be open by Changing some Settings of it. Open Link in New Window Option will Open it as a New Tab and Open Link in Current Window Option will open it in the Same Tab.

26) Anchor

Use this Tool to Add an ID to a Specific Place of your Website and You can Link to that Specific Place Easily by the Insert / Edit Link Tool.

27) Insert Template

By this Tool, you can Easily Add some Various Website Templates and Edit them as you want. You can also Add some Beautiful Website Templates with it's CSS File by Typing the Commands which were given at the Template Codes Section. 

28) Embed Iframe

To show Another Website in your Website by giving a Preview Space to it.

29) Metadata and Document Properties

To Add Title, Keywords, Description, Robots, Author and Encoding to your Website Easily.

30) Blocks

To Add Headers from H1 to H6 and to Add Preformatted Text.

31) Fonts

To Change the Font of the Selected Text. There are more than 15 Fonts given by us and you can Add them Easily. If you want more Fonts, you can do it by Editing the Code of your Website.

32) Font Sizes

To Change the Font Size of the Selected Text.

33) Strikethrough

To Add a Strike through the Text.

34) Superscript

To Add some Text above the Normal Line

35) Subscript

To Add some Text below the Normal Line

36) Heading 1 (Shift + Alt + 1)

To Add a Header in H1 Format.

37) Heading 2 (Shift + Alt + 2)

To Add a Header in H2 Format.

38) Heading 3 (Shift + Alt + 3)

To Add a Header in H3 Format.

39) Heading 4 (Shift + Alt + 4)

To Add a Header in H4 Format.

40) Heading 5 (Shift + Alt + 5)

To Add a Header in H5 Format.

41) Heading 6 (Shift + Alt + 6)

To Add a Header in H6 Format.

42) Insert Checklist

Use this Tool to Add a Simple Checklist to your Website.

43) Insert Date / Time

To Add Date and Time.

44) Horizontal Line

This Tool will make a Horizontal Rule in your Website.

45) Show Blocks

This Tool can Show the Blocks of your Website.

46) Show Invisible Characters

This Tool can Show the Hidden Characters like Space and such things which are on your Website.

47) Blockquote

To show that the Given Text was Copied by you from another Place.

48) Insert / Edit Code Sample

To show a Code to the Visitors who visit your Website. They can Easily Recognize the Code and they can Copy it if they like. You can only Add Codes which were Written using HTML / XML, CSS, Javascript, PHP Java, C, C#, C++, Python or Ruby Language. Other Language Codes will not be able to Recognize by the users Easily because they will be Desplayed as Plain Text without any Formatting.

49) Cut (Ctrl + X)

To Cut the Selected Text or Objects.

50) Copy (Ctrl + C)

To Copy the Selected Text or Objects.

51) Paste (Ctrl + V)

To Paste the Selected Text or Objects. (If this Tool was not Supported by Your Browser, Please use the Keyboard Shortcut. If you are using Mobile, Please use a Keyboard App like GBoard or Flash Board which gives you to Paste Text Easily.)

52) Paste as Text

To Paste the Only the Selected Text as Plain Text which has no Format.

53) Select All (Ctrl + A)

To Select all the things in your Website Easily.

54) New Document

To get a New Document. (If you Clicked on this while Making your Website, Press the Undo Tool to get it Back if you want.)

55) Decrease Indent

To Decrease Indent of the Selected Area.

56) Increase Indent

To Increase Indent of the Selected Area.

57) Left to Right

To make the Selected things Left to Right.

58) Right to Left

To make the Selected things Right to Left. 

59) Insert Image

Use this Tool to Add some Quick Temporary Images. (Images which you Upload using this Tool will be Removed when you Close this Tab.)

60) Insert Table

To Add a Quick Table with 2 Raws and 2 Columns.

61) Line Height

To Change the Height between Two Lines.

62) Nonbreaking Space

To Add a Nonbreaking Space Easily.

63) Page Break

To Add a Page Break Easily.

64) Accessibility Checker

To Check and Solve the Wrong and Incomplete things of your Website Easily.

65) Find and Replace (Ctrl + F)

To Find and Replace a Word in your Website.

66) Word Count

Use this Tool to Count the Words, Characters with No Spaces and Characters with Spaces on the Whole Website or a Selected Area.

67) Spellcheck

To Check and Correct the Spelling Errors of your Website Easily .

68) Help

To Know more about Shortcuts, Navigations and Plugins.

Instructions

Want to Upload your Website to the Internet for Free? Watch the below Article and do so to Upload your Website to infinityfree.net which gives you Unlimited Hosting Space, Bandwidth, Subdomains and much more for Free.
Learn how to Upload a Website to the Internet for Free

Want to know about the Responsiveness of your Website? Copy your Code and go to the Website given below. Then Paste the Code and change the Resolution of the Preview and look how it will be Displayed in Various Devices.
Check your Website Responsiveness for Free via Online

Post a Comment

Previous Post Next Post