Komponen

Table of Contents

Accordion

Is this template compatible with Wordpress?
Currently, the Wordpress version is not available. You can only use this template on the Blogger platform.
What do you get when you buy a template here?
You will receive a template bundle according to the product you purchased, and you can download it again for free if a new version is available.
Can we assist you with the template installation process?
Of course, we will be happy to assist you if you have any difficulties during the template installation process.
Will you get updates?
Yes, you will get FREE UPDATES forever, including the latest version updates.
Are there any additional fees for updates?
No, there are no additional fees.
Can you get a refund?
Sorry, purchased items cannot be returned. Please read the Terms & Conditions for more information.
Can the template be resold?
No, you can only use the template for personal purposes. Reselling the template is strictly prohibited. Please read the Terms & Conditions for more information.
Can the template be installed on multiple blogs?
Yes, there is no limit to the number of blogs as long as the blogs are still yours.
Are free templates available on Gila Temax?
Yes, definitely. Please wait for the next update.

Alert

Default Alert

This is an info alert.
This is a success alert.
This is a warning alert.
This is an error alert.

Outlined Alert

This is an info alert.
This is a success alert.
This is a warning alert.
This is an error alert.

Blockquote

if you do not change the typeface, be sure to load the default 'Roboto' font. For example, from fonts.google.com.

Buttons

Button Variants

Extended FABs

FABs

Icon Buttons

Split Buttons

  • Simpan salinan
  • Bagikan
  • Cetak
  • Simpan salinan
  • Bagikan
  • Cetak
  • Simpan salinan
  • Bagikan
  • Cetak

Affiliate Buttons (Supports All Templates)

Download Box

Coda v1.0.zip
500 KB
Coda v1.0.zip
500 KB

Guide List

  1. Sociis tellus condimentum non commodo amet vulputate leo conubia nunc egestas duis sociosqu fringilla tristique lacinia consequat a pellentesque iaculis!
    1. Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.
    2. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus.
    3. Phasellus ultrices nulla quis nibh. Quisque a lectus. Donec consectetuer ligula vulputate sem tristique cursus. Nam nulla quam, gravida non, commodo a, sodales sit amet, nisi.
  2. At libero bibendum semper integer phasellus ultrices volutpat nascetur vel platea hendrerit hac per lorem elementum dolor maecenas venenatis erat?
    • Aliquam tincidunt mauris eu risus.
    • Vestibulum auctor dapibus neque.
    • Nunc dignissim risus id metus.
    • Cras ornare tristique elit.
    • Vivamus vestibulum ntulla nec ante.
  3. Nascetur imperdiet congue facilisi habitasse viverra sit pharetra vulputate tellus viverra amet interdum magna posuere neque class dui suspendisse netus.
  4. Posuere a quam varius natoque blandit primis dui massa tempor praesent non massa orci class vehicula molestie nec nibh cum.
  5. Porta dolor odio diam laoreet augue sed et est tortor.

Pricing Table

The best of Google AI in one membership

Cancel anytime. By subscribing, you agree to Google One, AI credits, YouTube, and offers terms. Age limits,
language availability, system requirements, and other restrictions may apply. See how Google handles data.

Google AI Plus

Get more access to new and powerful features to boost your productivity and creativity
IDR 75,000 IDR 37,500 /mo
for 6 months
Get Google AI Plus
  • Gemini app Get next-level access to our most capable model 2.5 Pro, Deep Research on 2.5 Pro and unlock video generation with limited access to Veo 3.1
  • Flow Our AI filmmaking tool to create cinematic scenes and stories, including limited access to Veo 3.1
  • Whisk Next-level access to image-to-video creation with Veo 3
  • 200 monthly AI credits Across Flow and Whisk
  • NotebookLM Research and writing assistant with more access to Audio Overviews, notebooks, and more
  • Gemini in Gmail, Docs & more Access Gemini directly in Google apps
  • Storage 200 GB of total storage for Photos, Drive & Gmail

Google AI Pro

Get higher access to new and powerful features to boost your productivity and creativity
IDR 309,000 IDR 0 /mo
for 1 month
Get Google AI Pro
  • Gemini app Get higher access to our most capable model 2.5 Pro, Deep Research on 2.5 Pro and unlock video generation with limited access to Veo 3.1
  • Flow Get higher access to our AI Filmmaking tool to create cinematic scenes and stories, including limited access to Veo 3.1
  • Whisk Next-level access to image-to-video creation with Veo 3
  • 1,000 monthly AI credits Across Flow and Whisk
  • NotebookLM Research and writing assistant with 5x more Audio Overviews, notebooks, and more
  • Gemini in Gmail, Docs, Vids & more Access Gemini directly in Google apps
  • Gemini Code Assist and Gemini CLI Higher daily model requests across Flash and Pro models in Gemini CLI and Gemini Code Assist IDE extensions
  • Jules Higher limits when using Jules, our asynchronous coding agent for software developers
  • Storage 2 TB of total storage for Photos, Drive & Gmail

Google AI Ultra

Unlock the highest levels of access to the best of Google AI and exclusive features
IDR 3,849,000 IDR 1,929,000 /mo
for 3 months
Get Google AI Ultra
  • Gemini app Highest limits to features and models, access to 2.5 Pro Deep Think (most advanced reasoning mode) and Veo 3.1 (latest video generation model)
  • Flow Highest limits to AI Filmmaking tool with access to Veo 3.1
  • Whisk Next-level access to image-to-video creation with Veo 3
  • 25,000 monthly AI credits Across Flow and Whisk
  • NotebookLM Highest limits and best model capabilities (later this year)
  • Gemini in Gmail, Docs, Vids & more Highest limits to Gemini directly in Google apps
  • YouTube Premium individual plan YouTube ad-free, offline, and in the background
  • Gemini Code Assist and Gemini CLI Highest daily model requests across Flash and Pro models in Gemini CLI and Gemini Code Assist IDE extensions
  • Jules Highest limits when using Jules, our asynchronous coding agent for software developers
  • Storage 30 TB of total storage for Photos, Drive & Gmail
Certain AI benefits are only available for ages 18+. Learn more about Google AI benefits

Snackbar

Syntax Highlighter

Default

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Ubah Warna Latar</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <div class="container">
    <h1>Tekan Tombol untuk Mengubah Warna Latar</h1>
    <button id="changeColorButton">Ubah Warna</button>
  </div>
  <script src="script.js"></script>
</body>
</html>

Multi Tab

  • HTML
  • CSS
  • JavaScript
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Ubah Warna Latar</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <div class="container">
    <h1>Tekan Tombol untuk Mengubah Warna Latar</h1>
    <button id="changeColorButton">Ubah Warna</button>
  </div>
  <script src="script.js"></script>
</body>
</html>
body {
  margin: 0;
  font-family: Arial, sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  background-color: #f4f4f4;
}
.container {
  text-align: center;
}
button {
  padding: 10px 20px;
  font-size: 16px;
  cursor: pointer;
  border: none;
  border-radius: 5px;
  background-color: #007BFF;
  color: white;
  transition: background-color 0.3s ease;
}
button:hover {
  background-color: #0056b3;
}
document.getElementById('changeColorButton').addEventListener('click', function() {
  const randomColor = `#${Math.floor(Math.random() * 16777215).toString(16)}`;
  document.body.style.backgroundColor = randomColor;
});

Table

Invoice Status Method Amount
INV001 Paid Credit Card $250.00
INV002 Pending PayPal $150.00
INV003 Unpaid Bank Transfer $350.00
INV004 Paid Credit Card $450.00
INV005 Paid PayPal $550.00
INV006 Pending Bank Transfer $200.00
INV007 Unpaid Credit Card $300.00
Total $2,500.00

Tabs

Primary Tabs

  • Keyboard
  • Guitar
  • Drums
  • Bass
  • Video
Keyboard
Guitar
Drums
Bass
Video

Secondary Tabs

  • Travel
  • Hotel
  • Activities
  • Food
Travel
Hotel
Activities
Food

Scrolling Tabs

  • Keyboard
  • Guitar
  • Drums
  • Bass
  • Video
  • Travel
  • Hotel
  • Activities
  • Food
  • Movies
Keyboard
Guitar
Drums
Bass
Video
Travel
Hotel
Activities
Food
Movies

Text Fields

Default Text Field

Supporting text
Supporting text

Forms

Text Areas

Supporting text
Supporting text

Tooltips

Use tooltips to add additional context to a button Buttons let people take action and make choices with one tap. More on buttons or other UI element.

Rich tooltips Rich tooltips provide additional context about a UI element. They can optionally contain a subhead, buttons, and hyperlinks. have more rounded corners.

WhatsApp Channel Card

Horizontal Card

Vertical Card