other but working

-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Instagram English Hindi Post Creator</title>

<link href="https://fonts.googleapis.com/css2?family=Laila:wght@400;600&family=Baloo+2:wght@400;600&display=swap" rel="stylesheet">

<style>
body{
  margin:0;
  padding:10px;
  background:#eee;
  font-family:'Baloo 2', cursive;
}
.container{
  max-width:420px;
  margin:auto;
  background:#fff;
  padding:12px;
  border-radius:12px;
}
textarea{
  width:100%;
  height:80px;
  margin-bottom:8px;
  padding:8px;
  font-size:16px;
}
.controls{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-bottom:10px;
}
button{
  padding:10px;
  font-size:15px;
  border:none;
  border-radius:8px;
  background:#000;
  color:#fff;
  cursor:pointer;
}
canvas{
  width:100%;
  max-width:360px;
  display:block;
  margin:auto;
}
</style>
</head>

<body>

<div class="container">

<textarea id="engText" placeholder="English sentence"></textarea>
<textarea id="hinText" placeholder="हिंदी वाक्य"></textarea>

<div class="controls">
<label>English Color <input type="color" id="engColor" value="#000000"></label>
<label>Hindi Color <input type="color" id="hinColor" value="#000000"></label>

<label>Solid BG <input type="color" id="bgColor" value="#ffffff"></label>
<button onclick="randomGradient()">Random Gradient</button>

<select id="borderStyle">
<option value="solid">Solid Border</option>
<option value="dashed">Dashed Border</option>
<option value="dotted">Dotted Border</option>
</select>

<select id="shape">
<option value="square">Square</option>
<option value="round">Rounded</option>
</select>
</div>

<button onclick="createPost()">Create Image</button>
<button onclick="download()">Download HD</button>

<canvas id="canvas" width="1080" height="1080"></canvas>

</div>

<script>
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");

let currentGradient = null;

function randomGradient(){
  const r = () => Math.floor(Math.random()*256);
  currentGradient = ctx.createLinearGradient(0,0,1080,1080);
  currentGradient.addColorStop(0,`rgb(${r()},${r()},${r()})`);
  currentGradient.addColorStop(1,`rgb(${r()},${r()},${r()})`);
  createPost();
}

function wrapAndFit(text, x, y, width, height, color){
  let size = 90;
  ctx.textAlign="center";
  ctx.textBaseline="middle";

  while(size>10){
    ctx.font = size+"px Laila";
    let words = text.split(" ");
    let lines=[];
    let line="";

    for(let w of words){
      let test=line+w+" ";
      if(ctx.measureText(test).width>width){
        lines.push(line);
        line=w+" ";
      } else {
        line=test;
      }
    }
    lines.push(line);

    let totalHeight = lines.length * size * 1.2;
    if(totalHeight <= height){
      ctx.fillStyle=color;
      let startY = y - totalHeight/2 + size/2;
      for(let i=0;i<lines.length;i++){
        ctx.fillText(lines[i], x, startY + i*size*1.2);
      }
      break;
    }
    size--;
  }
}

function createPost(){
  const eng=document.getElementById("engText").value;
  const hin=document.getElementById("hinText").value;
  const engColor=document.getElementById("engColor").value;
  const hinColor=document.getElementById("hinColor").value;
  const bg=document.getElementById("bgColor").value;
  const border=document.getElementById("borderStyle").value;
  const shape=document.getElementById("shape").value;

  if(currentGradient){
    ctx.fillStyle=currentGradient;
  } else {
    ctx.fillStyle=bg;
  }
  ctx.fillRect(0,0,1080,1080);

  wrapAndFit(eng,540,270,900,500,engColor);
  wrapAndFit(hin,540,810,900,500,hinColor);

  ctx.lineWidth=8;
  ctx.setLineDash(border==="dashed"?[20,10]:border==="dotted"?[5,10]:[]);
  ctx.strokeStyle="#000";
  ctx.strokeRect(20,20,1040,1040);

  canvas.style.borderRadius = shape==="round"?"24px":"0";
}

function download(){
  const a=document.createElement("a");
  a.download="insta_post_"+Date.now()+".png";
  a.href=canvas.toDataURL("image/png");
  a.click();
}
</script>

</body>
</html>

इस ब्लॉग से लोकप्रिय पोस्ट

High Level Advance Random English Words

-
Adversity Prosperity Struggle Transformation Evolution Redemption Downfall Ascension Resilience Endurance Perseverance Triumph Defeat Suffering Growth Maturity Awakening Enlightenment Disillusionment Acceptance Rejection Isolation Belonging Alienation Fulfillment Emptiness Ambition Obsession Sacrifice Commitment Betrayal Loyalty Reconciliation Regret Remorse Redirection Reinvention Self-discovery Self-realization Identity Purpose Destiny Fate Misfortune Fortune Breakthrough Collapse Reconstruction Rebirth Renewal Adaptation Adjustment Survival Vulnerability Strength Wisdom Ignorance Awareness Realization Reflection Introspection Confusion Clarity Conflict Resolution Acceptance Resistance Liberation Oppression Fear Courage Hope Despair Motivation Exhaustion Burnout Recovery Healing Restoration Closure Transition Stagnation Progress Regression Achievement Failure Legacy
और पढ़ें

The History of the World – A Simple and Long Article for English Learners

-
ठीक है, अब मैं आपको अगला बड़ा और आसान इंग्लिश आर्टिकल दे रहा हूँ। इस बार का विषय है — 🇺🇳 The United Nations (UN) – A Simple and Long English Article for English Learners The United Nations , also called the UN , is an international organization. It was created to maintain peace, help countries work together, and solve world problems. The UN was formed after World War 2 , when countries realized they needed a system to prevent such big wars in the future. 📅 When and Where Was the UN Founded? Date: 24 October 1945 Place: San Francisco, USA Started with: 51 member countries Today: 193 member countries The headquarters of the UN is in New York City, USA . 🎯 Main Goals of the UN Maintain World Peace – Stop wars and conflicts. Protect Human Rights – Ensure fairness and freedom for all people. Help in Development – Support poor countries in education, health, and jobs. Provide Humanitarian Aid – Help during natural disasters or wars. Promote International...
और पढ़ें

1. The Art of Self-Discipline

-
 The Art of Self-Discipline: A Complete, Practical, and Inspiring Guide Overview Self-discipline is the quiet architecture of a meaningful life. It is not punishment. It is not self-hatred. It is a rational, compassionate structure that lets you act on your best judgment—especially when you do not “feel like it.” Motivation is a spark; self-discipline is the wiring, the switch, and the circuit breaker that keep the lights on. This guide blends psychology, philosophy, neuroscience, and real-world practice. The language is advanced but the sentences are simple and direct. Use it as a handbook, not a lecture. Part I — Foundations What Self-Discipline Actually Is Definition: The consistent ability to align daily actions with chosen values and long-term goals, under a system of clear rules, supportive environments, and measured feedback. Key property: It is built, not found. It grows through repetition, design, and reflection—not through mood. Discipline vs. Motivation Motivation is vol...
और पढ़ें