Skip to content
Related Articles

Related Articles

Build an Android App with HTML, CSS and JavaScript in Android Studio

View Discussion
Improve Article
Save Article
Like Article
  • Last Updated : 22 Mar, 2022

Android is a mobile operating system based on a modified version of the Linux kernel and other open-source software, designed primarily for touchscreen mobile devices such as smartphones and tablets. Yes, you read it right in the title of this article. In this article, we are going to build an Android App with HTML, CSS, and JavaScript in Android Studio.

What we are going to build in this application?

Here is a sample video of what we are going to build in this article. We will text display text using HTML and Javascript and change the background color using CSS.

Step by Step Implementation

Step 1: Create a New Project

  • Open a new project.
  • We will be working on Empty Activity with language as Java. Leave all other options unchanged.
  • Name the application at your convenience.
  • There will be two default files named activity_main.xml and

If you don’t know how to create a new project in Android Studio then you can refer to How to Create/Start a New Project in Android Studio?  

Step 2. Working on the XML file

Navigate to the app > res > layout > activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file.


<?xml version="1.0" encoding="utf-8"?>

Step 3. Working on HTML file

Navigate to app > new > file and name it as index.html. Use the following code in the index.html file


    <link rel="stylesheet" href="style.css">
    This Text is shown with help of HTML.
<script src="index.js"></script>

Step 4. Working on CSS file

Navigate to app > new > file and name it as style.css. Use the following code in the style.css file


    background-color: pink;

Step 5. Working on Javascript file

Navigate to app > new > file and name it as index.js. Use the following code in the index.js file


document.write("This text is shown from Javascript");

Step 6. Working on Java file

Navigate to the file and use the following code in it.


package com.example.androidwebapp;
import android.os.Bundle;
import android.webkit.WebView;
public class MainActivity extends AppCompatActivity {
    protected void onCreate(Bundle savedInstanceState) {
        WebView webView=findViewById(;

Here is the final output of our application.


My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!