ਮੁਫ਼ਤ ਪਰਿਵਰਤਕ

CSS ਫਲੈਕਸਬਾਕਸ ਖਾਕਾ ਜਨਰੇਟਰ

ਲਾਈਵ ਪ੍ਰੀਵਿਊ ਦੇ ਨਾਲ CSS ਫਲੈਕਸਬਾਕਸ ਲੇਆਉਟ ਨੂੰ ਦ੍ਰਿਸ਼ਟੀਗਤ ਰੂਪ ਵਿੱਚ ਤਿਆਰ ਕਰੋ। ਫਲੈਕਸ-ਦਿਸ਼ਾ, ਜਾਇਜ਼-ਸਮੱਗਰੀ, ਇਕਸਾਰ-ਆਈਟਮਾਂ, ਅਤੇ ਹੋਰ - ਮੁਫਤ ਅਤੇ ਕਲਾਇੰਟ-ਸਾਈਡ ਨੂੰ ਵਿਵਸਥਿਤ ਕਰੋ।

ਲਾਈਵ ਪ੍ਰੀਵਿਊ
1
2
3
4
5
flex-ਦਿਸ਼ਾ
ਲਪੇਟਣਾ
ਜਾਇਜ਼-ਸਮੱਗਰੀ
ਇਕਸਾਰ-ਆਈਟਮਾਂ
ਪਾੜਾ (8px)
0px32px64px
CSS ਆਉਟਪੁੱਟ
.container {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;
  align-content: stretch;
  gap: 8px;
}

.item {
  padding: 1rem 1.5rem;
  border-radius: 8px;
  font-weight: 600;
  font-size: 0.9rem;
  min-width: 60px;
  text-align: center;
}

ਇਸ ਟੂਲ ਬਾਰੇ

ਸਿੱਧੇ ਆਪਣੇ ਬ੍ਰਾਊਜ਼ਰ ਵਿੱਚ Css Flexbox Generator ਨਾਲ ਸਮੱਗਰੀ ਬਣਾਓ ਅਤੇ ਅਨੁਕੂਲਿਤ ਕਰੋ। ਆਪਣੀਆਂ ਤਰਜੀਹਾਂ ਨੂੰ ਕੌਂਫਿਗਰ ਕਰੋ, ਆਉਟਪੁੱਟ ਤਿਆਰ ਕਰੋ, ਅਤੇ ਨਤੀਜਾ ਡਾਊਨਲੋਡ ਜਾਂ ਕਾਪੀ ਕਰੋ। ਹਰ ਚੀਜ਼ ਕਲਾਇੰਟ-ਸਾਈਡ ਚੱਲਦੀ ਹੈ — ਤੁਹਾਡਾ ਡੇਟਾ ਨਿਜੀ ਰਹਿੰਦਾ ਹੈ ਅਤੇ ਪ੍ਰਕਿਰਿਆ ਤੁਰੰਤ ਹੁੰਦੀ ਹੈ।

ਵਰਤਣ ਦਾ ਤਰੀਕਾ

  1. ਆਪਣੀਆਂ ਲੋੜਾਂ ਨਾਲ ਮੇਲ ਕਰਨ ਲਈ ਸੈਟਿੰਗਾਂ ਅਤੇ ਵਿਕਲਪਾਂ ਨੂੰ ਕੌਂਫਿਗਰ ਕਰੋ।
  2. ਆਪਣਾ ਆਉਟਪੁੱਟ ਬਣਾਉਣ ਲਈ ਜਨਰੇਟ 'ਤੇ ਕਲਿੱਕ ਕਰੋ।
  3. ਨਤੀਜੇ ਦੀ ਪੂਰਵਦਰਸ਼ਨ ਕਰੋ ਅਤੇ ਲੋੜ ਪੈਣ 'ਤੇ ਵਿਵਸਥਾ ਕਰੋ।
  4. ਆਉਟਪੁੱਟ ਫਾਈਲ ਨੂੰ ਡਾਊਨਲੋਡ ਕਰੋ ਜਾਂ ਇਸਨੂੰ ਆਪਣੇ ਕਲਿੱਪਬੋਰਡ ਵਿੱਚ ਕਾਪੀ ਕਰੋ।

ਅਕਸਰ ਪੁੱਛੇ ਜਾਣ ਵਾਲੇ ਸਵਾਲ

ਕੀ ਮੈਂ ਤਿਆਰ ਕੀਤੇ ਆਉਟਪੁੱਟ ਨੂੰ ਅਨੁਕੂਲਿਤ ਕਰ ਸਕਦਾ ਹਾਂ?
ਹਾਂ। ਟੂਲ ਤੁਹਾਡੀਆਂ ਖਾਸ ਲੋੜਾਂ ਮੁਤਾਬਕ ਆਉਟਪੁੱਟ ਨੂੰ ਅਨੁਕੂਲ ਬਣਾਉਣ ਲਈ ਵੱਖ-ਵੱਖ ਅਨੁਕੂਲਤਾ ਵਿਕਲਪ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ। ਤਿਆਰ ਕਰਨ ਤੋਂ ਪਹਿਲਾਂ ਸੈਟਿੰਗਾਂ ਨੂੰ ਵਿਵਸਥਿਤ ਕਰੋ, ਜਾਂ ਵੱਖ-ਵੱਖ ਵਿਕਲਪਾਂ ਨਾਲ ਮੁੜ-ਜਨਰੇਟ ਕਰੋ।
ਕੀ ਤਿਆਰ ਕੀਤੀ ਸਮੱਗਰੀ ਵਰਤਣ ਲਈ ਮੁਫ਼ਤ ਹੈ?
ਹਾਂ। ਇਸ ਟੂਲ ਨਾਲ ਜੋ ਵੀ ਤੁਸੀਂ ਉਤਪੰਨ ਕਰਦੇ ਹੋ, ਉਹ ਨਿੱਜੀ, ਵਿਦਿਅਕ, ਜਾਂ ਵਪਾਰਕ ਉਦੇਸ਼ਾਂ ਲਈ ਬਿਨਾਂ ਕਿਸੇ ਪਾਬੰਦੀਆਂ ਜਾਂ ਵਿਸ਼ੇਸ਼ਤਾ ਲੋੜਾਂ ਦੇ ਵਰਤਣ ਲਈ ਤੁਹਾਡੀ ਹੈ।
ਕੀ ਇਸ ਲਈ ਖਾਤੇ ਦੀ ਲੋੜ ਹੈ?
ਨਹੀਂ। ਇਹ ਟੂਲ ਬਿਨਾਂ ਸਾਈਨ-ਅੱਪ, ਕੋਈ ਈਮੇਲ, ਅਤੇ ਬਿਨਾਂ ਰਜਿਸਟ੍ਰੇਸ਼ਨ ਦੇ ਤੁਰੰਤ ਵਰਤਣ ਲਈ ਤਿਆਰ ਹੈ। ਬਸ ਪੰਨਾ ਖੋਲ੍ਹੋ ਅਤੇ ਬਣਾਉਣਾ ਸ਼ੁਰੂ ਕਰੋ।
ਕੀ ਮੇਰਾ ਇਨਪੁਟ ਡੇਟਾ ਨਿੱਜੀ ਰੱਖਿਆ ਜਾਂਦਾ ਹੈ?
ਹਾਂ। ਸਾਰੀ ਪ੍ਰਕਿਰਿਆ ਤੁਹਾਡੇ ਬ੍ਰਾਊਜ਼ਰ ਵਿੱਚ ਹੁੰਦੀ ਹੈ। ਤੁਹਾਡਾ ਇਨਪੁਟ ਡੇਟਾ ਅਤੇ ਤਿਆਰ ਕੀਤਾ ਆਉਟਪੁੱਟ ਕਦੇ ਵੀ ਕਿਸੇ ਬਾਹਰੀ ਸਰਵਰ ਨੂੰ ਨਹੀਂ ਭੇਜਿਆ ਜਾਂਦਾ ਹੈ।